CODEWITHSUNDEEP
htmlimageinline
Kevin Kretschmer
Kevin Kretschmer

Reputation: 1

html displaying inline image

I'm trying to display an image on my web page. I've been working offline, but I put the .html and .jpg files in the same directory. When I go to run it, it doesn't show the images. Instead, I get the alt value, along with some weird ASCII symbols.

Here is the html code, as you can see it is very basic:

<head>
    <title> Mpms Janitorial </title>
</head>

<body>
<img src=”site.jpg” alt=”text” />
</body>

Upvotes: 0

Views: 186

Answers (2)

Jukka K. Korpela
Jukka K. Korpela

Reputation: 201768

As others have written, you are using incorrect quotation marks around attribute values. Probably something caused Ascii quotation marks (") to be changed to curly quotation marks (”) when you copied your HTML code into a file on the server.

Curly quotation marks are perfectly OK in data in HTML, but they cannot be used as delimiters around attribute values. An attribute value must be delimited by Ascii quotation marks ("), or by Ascii apostrophes ('), or, under certain conditions, used without delimiters. So both src="site.jpg" and src='site.jpg' would be correct, and src=site.jpg would be correct, too, except in XHTML. Similarly for the alt attribute.

But when you use curly quotation marks, they will be taken as part of the data, so the browser will request for a resource named literally (with the quotes) as ”site.jpg”. This will fail, so what you see will be, depending on browser, a generic symbol of broken image, or the alt attribute value, or a combination of the two.

The “weird ASCII symbols” that you saw are probably the curly quotes when misinterpreted according to a wrong character encoding. Although this symptom will vanish if you replace the curly quotes or remove them, it is a symptom of a problem that may cause trouble later if your document will contain, for example, curly quotes in text, as required e.g. by English orthography. So I recommend that you check the W3C page on character encodings.

(My guess is that what you saw was something like â€textâ€. The characters †(which are not Ascii characters) are what you get if you have a curly quotation mark in an UTF-8 encoded document that is being misinterpreted as if it were windows-1252 encoded – a rather common scenario when declared and actual character encoding do not match.)

Upvotes: 2

Kara
Kara

Reputation: 6226

You are missing the <html> tag around your code. You also are using some unusual quotes for the img tag.

Try this:

<html>
<head>
    <title> Mpms Janitorial </title>
</head>

<body>
<img src="site.jpg" alt="text" />
</body>
</html>

Upvotes: 1

Related Questions