Inline style works without quotes

问题

I have , for example , this fiddle . You can clearly see I am missing the quotes in the inline-style , but still it does show up correctly . From wherever I have learned , never did they say that not using quotes is allowed . So , is this:

A bug in jsFiddle
An intended feature . If so , then why we are taught to use the quotes.
(Something that you may suggest)

Reference Code:

index.html

<div style=background-color:red></div>This styling is weird

stylesheet.css

div{ height:500px ; width:500px }

Thanks.

回答1:

Quotes for HTML attributes are considered optional (for HTML, not XHTML), however there are some cases where you may run into some problems.

e.g.

<a title=Hi, mom! href=#>

This isn't valid because of the space between 'Hi' and 'mom!'. Quotes group the statement together.

<div rel=a&b></div>

Rel value seen as "a&b" in all modern browsers including IE 9 and 10. IE 6, 7, and 8 see the value as "a".

More examples can be found here: http://css-tricks.com/problems-with-unquoted-attributes/

回答2:

You might run into problems when your attribute contents contain white space etc. From the HTML spec (http://www.w3.org/TR/REC-html40/intro/sgmltut.html#h-3.2.2):

In certain cases, authors may specify the value of an attribute without any quotation marks. The attribute value may only contain letters (a-z and A-Z), digits (0-9), hyphens (ASCII decimal 45), periods (ASCII decimal 46), underscores (ASCII decimal 95), and colons (ASCII decimal 58). We recommend using quotation marks even when it is possible to eliminate them.