HTML Link not working with my quotations - html

So I am starting to learn HTML and I am running into some weird things. I am trying to just use a link to go to a specific webpage. I typed in the code but it gave me an error saying it could not find the link on my desktop. However, when I copy and paste the exact same code from a website it works fine. Here are the two codes so you can compare, the top one works and the bottom one doesn't.
This is a link
<a href=“https://www2.housing.wisc.edu/dining/ordering/”>This is a link</a>
I was wondering if it had to do with the slightly different quotation marks, if it is I am still not sure how to fix it, because the computer autocorrects the quotations to that format.

If the comments haven't answered your question yet, yes you need to use a slightly different quotation mark. HTML only accepts the single typewriter (non-curly) quotation mark ' ' or the double one " ". Or, in your case, you can choose not to use quotes at all, unless the value contains a space or equal sign.

What are you using? Office? Open up a text editor like Notepad or download Notepad++ (free) and you won't have to deal with auto correct.
In any case the code you posted above works for me.
Open Notepad.
copy and paste
<html>
<body>
This is a link
</body>
</html>
click SAVE AS and instead of saving as a .txt file save as a .html to your Desktop.
Double click the newly created file, and it should open in a web browser.(If not you have to right click on the file and select "open with..." and choose a web browser
Click the link.

Related

VS Code: Code gets pushed to the right when I save

When I save my file, a block of code gets messed up and end up being indented to the right.
Here is a screenshot to demonstrate the problem:
The code works but it's just not visually pleasant.
I have tried to uninstall some extensions, but none of them had to do with HTML.
Fixed by removing the extra " from line 645 to 647 that was causing the right indention.
For Visual Studio Code, you can use the hotkeys to reformat your code. The following hotkeys is for formatting your document, it works for html and other kinds of files as well, such as javascript files, json files, etc.
Format Document
Note: Different computer may have different settings. To search for hotkeys, ctrl + shift + P.
Why not try "save as" and give the file a new name. It might just save the changes the way you want it to.

HTML code indentation issues in google chrome browser

click this links to see the screenshots
full source code of the home page
source code of the external file
full source code of the home page (in google chrome inspect
view)
full source code of the home page (in google chrome page source
view)
I have been keeping the code indentation in that web pages from the beginning in my code editor. but when i see my site on google chrome, the indentation is not set properly. can I know why is this? I googled this, yet coudn't find an answer or a solution.
It is not Google Chrome's fault. Your files simply get compiled to this form, the browser displays them exactly as they look like.
But why they look like this? In your case PHP's include does only purely textual replacement, as in the picture bellow:
The effect is the same as if you copied the contents of the external file and pasted them to the main file, replacing the include tag.
If you would really insist on having the code indented properly after the include does its job, you would have to add new spaces at the beginning of each line (but first) of the included file. It would shift the text to the right (in this case 4 spaces) and in the result the indentation would be preserved.
However, I'd discourage you from doing so -- it is only the code that is generated, probably no one is going to work with the compiled result. Proper formatting of code is only meant to make the human work easier -- it has no effect on how the page will eventually look like, when rendered by browser. Thus, it probably would suffice if you kept the two source files formatted as they currently are and left the output as is, even though it is not indented well.
If you'd like to have the code properly formatted in the page source view, please remember that you can simply use the "pretty print" button in the lower left corner of the preview:

Browser will not display image

I'm building a simple website example where I added an image. I'm using textedit on mac. However, special characters are being added to the file when I look in Chrome's inspector.
In textedit I type
<img src =“images/nicole.png”>
But it displays as
<img src="“images/nicole.pngâ€"">
Why is this happening?
The quote you are currently using is a Unicode version (Most likely the Chinese version). That's why it is showing as those weird chars. Try to copy and paste this " into your code instead of typing them in should fix it. You might want to check your IME setting or text editor setting to prevent it in the future.
In the TextEdit preferences (TextEdit menu > Preferences), uncheck "Smart quotes" under Options.
You will have to go through and replace all of them.

Page shows code not rendering

I know this is simple question, but i am fighting with it for few hrs, so its better to ask in forum to get help quickly. I have added the following simple html snippet in a TextEdit program and saved the file as webpage(.html). When I run this file in any browser, like safari, chrome or firefox, it shows the same code there instead of rendering this as web page.
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
Could someone help me to show this as real web page rather than source code showing?
If you have access to the server scripts creating the page, then check if somewhere the http headers are being changed by that code. The browser needs to receive a header like that
Content-Type: text/html
[example in PHP: header(Content-Type: text/html);]
in order to render html properly. If this header is changed, then the browser won't be able to interpret it as html.
It is likely that TextEdit has formatted your text, since by saving it as a Web Document it thinks that you have typed up the web page how you want it displayed, with all formatting, instead of raw HTML code. Try to save the document as raw text, then change the extension manually from whatever it is (probably .txt) to .html. For a more permanent solution, it is advisable to use a non-formatting text editor when coding.
EDIT: This is what Apple have to say: http://support.apple.com/kb/ta20406
The solution to your problem is simple.
Just open TextEdit and go to preferences.
Just tick the box which says"display html files as html code instead of formatted text".
Your problem will be solved. :)
You have saved the text you pasted in as HTML content, in the HTML editor. Instead, you should try to paste the text in the code view, not the editor view.
In case any of you have already created the file and not sure how to proceed, open the file in TextEdit. Go to Format -> Make plan text. Then save and close the file. Then open the file location in finder and rename to .html and this will convert the file appropriately.

Generated HTML word document not displaying image correctly

I'm trying to add an image to a generated html word document that is embedded in a classic ASP page. The code looks something like this:
<%
Response.ContentType = "application/msword"
%>
<html xmlns:v="urn:schemas-microsoft-com:vml"
xmlns:o="urn:schemas-microsoft-com:office:office"
xmlns:w="urn:schemas-microsoft-com:office:word">
...
<v:shape id="_x0000_s1030" type="#_x0000_t75" style='position:absolute;
left:0;text-align:left;margin-left:0;margin-top:17.95pt;width:7in;height:116.85pt;
z-index:2;mso-position-horizontal:center;mso-position-horizontal-relative:page;
mso-position-vertical-relative:page'>
<v:imagedata src="http://xxx/image001.gif" o:title="image001"/>
<w:wrap anchorx="page" anchory="page"/>
<w:anchorlock/>
</v:shape><![endif]--><![if !vml]><span style='mso-ignore:vglayout;position:
absolute;z-index:0;left:0px;margin-left:0px;margin-top:24px;width:672px;
height:156px'><img width=672 height=156
src="http://xxx/image001.gif" v:shapes="_x0000_s1030"></span><![endif]>
The image URL is correct and can be viewed through a browser, however when the word document opens, the image has a red x, with the error message:
The image cannot be displayed. Your
computer may not have enough memory to
open the image, or the image may be
corrupted. Restart your computer, and
then open the file again. If the red x
still appears, you may have to delete
the image and then insert it again.
If i copy the html code and try to open the word document on my local machine, it displays the image correctly. It just doesn't work when retrieving the document from the server. This happens for any images I try to add. Is there another way to add images to html-generated word documents that can be output from an asp page?
Thanks.
Update:
Something that I've noticed is that when copying the word doc code from the asp page, pasting it into a file and renaming it as a word doc, I get this prompt when opening it:
Some of the files in this Web page aren't in the expected location. Do you want to download them anyway? If you're sure the Web Page is from a trusted source, click Yes.
If I click Yes, the image displays fine, if I click No, I get the same error as I described above. I'm thinking that because the word doc is coming from an ASP page, it is defaulting the security setting to not display external items. I've tried adding the site URL (it is a local intranet site) to my trusted sites and as a trusted location in word, but still no luck.
You could try removing the o:title tag. I've found that if that tag is there word tries to embed the image, but will only do so if it is in the proper location. By removing the o:title tag, word just treats it as a link.
Go into Options, Web Options (which might be under Advanced), uncheck "Rely on VML for displaying graphics in browsers"
Is all that code generated by Word 2007, or are you adding code by hand? It's interesting that the img tag doesn't have a slash to close it.
I know its a silly mistake, but did you make sure to put the image in the right place so that it can be accessed by the web page? If you just type in the http://xxx/image001.gif url into your browser, does the image appear? If not, I would say thats your problem.
Make sure the image's URL (location) is correct and add a slash.
If it still doesn't work, check if any other images from the same directory can display.
If they do then re-upload the image and try again.
If other images don't display and if you're sure that the URL is correct, then try editing the read permissions on the image directory and the images. I can't imagine that it could be caused by permissions though.
Unless there's a very specific reason to generate the HTML in MS Word, I'd advise you not to do it. Even for somebody who never saw HTML or CSS before, they're both very simple and tidy to learn and can produce much better results than MS Word.
Is Word 2007 allowed to access the internet? Maybe there's a firewall rule blocking it?
Replace the following line
"<v:imagedata src="............" o:title="image001"/>"
with simple a single line of code
"<img src="............"/>"
I am sure you will get the result.
I have checked it.