开发者

IE doesn't support Q tag but you can style it

开发者 https://www.devze.com 2022-12-12 17:34 出处:网络
I am puzzled with the statement that IE does not support <q> tag but it renders just fine on IE as an inline element so if it doesn\'t support it, so what? We can just style it with CSS to itali

I am puzzled with the statement that IE does not support <q> tag but it renders just fine on IE as an inline element so if it doesn't support it, so what? We can just style it with CSS to italicize开发者_Go百科 and it works as expected. I tested from IE5 and up.

http://www.w3schools.com/tags/tag_q.asp

Explain why it says it doesn't support it when I don't see anything that stops you from using the q element and be able to style it with CSS?


IE does understand the <q> element, in the sense that it's a valid tag and you can style it. (Other elements such as the HTML5 <header>/<footer> IE doesn't understand at all by default.)

Anyhoo, the statement "doesn't support" really means "doesn't follow the standard". It displays the <q> element fine but doesn't add quotation marks which the spec requires. This is fixed in IE8.

As Rich says, you can use pseudo-elements to add quotation marks - which you ought to do anyway - but neither IE6 nor IE7 support that. What I like to do though, is change the colour of the <q> element and/or make it italic in an IE-only stylesheet. So IE visitors will at least see a differentiation.

Here's a code snippet that may be useful. It adds double curly quotes to all <q> tags, and single curly quotes to nested <q> tags:

q:before {
    content: "\201c";
}
q:after {
    content: "\201d";
}
q q:before {
    content: "\2018";
}
q q:after {
    content: "\2019";
}


It's because other browsers automatically add speech marks around the content. IE isn't aware of it as separate tag, and doesn't do this.

Of course, you can use :before and :after to add the quotes, but that doesn't work in old versions of IE either.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号