样式(CSS)元素的放置在HTML中是否重要?

时间:2012-09-12 08:25:37

标签: html css

放置:

<style type="text/css">
...
</style>

重要吗?如果我把它放在页面div或体内,有什么区别吗?我最近发现它与javascript很重要。我的CSS也有一些问题(jQuery Mobile)。可能是原因吗?

4 个答案:

答案 0 :(得分:3)

样式元素应该适用于整个文档,无论它放在哪里,但是通常的做法是始终将它放在head元素中。如果你将它放在其他地方,如果浏览器处理有点不稳定,我不会感到惊讶。

请注意,html5允许您为style元素指定scoped属性,这意味着它仅适用于style元素的parent元素及其所有子元素。

顺便说一下,通常的做法是将css放在一个单独的文件中,并使用<link>标记将CSS包含在文档中。这样,您就可以跨多个页面共享css。

答案 1 :(得分:1)

关于样式表的顺序,这个位置很重要。在解决样式表之间的冲突时,在最后一步,当其他事物相等时,最后一个规则获胜。因此,重要的是style元素相对于其他样式元素以及引用样式表的link元素的位置。 (关于元素中style属性的问题并不重要,因为其他事情不能相等:属性通过特异性获胜。)

在验证中也很重要:除了style元素外,head元素无效。但浏览器并不关心这一点。

JavaScript代码当然可以依赖于它处理的元素的位置。这完全取决于代码。

答案 2 :(得分:0)

理想情况下它不应该,但不要这样做,这只是不好的做法,加上你的代码看起来很乱

答案 3 :(得分:0)

要直接回答问题,通常如果您将代码直接放在页面中,则会将其放在页面的<head>中。无论你把它放在哪里都应该工作,但<head>是常见做法。不确定你的目标究竟是什么,但对于电子邮件,我通常将其拆分为内联样式(将相关代码放在HTML标记本身,如<p style="line-height:1.4em;">)。

如果您正在处理网页,除非有特殊原因要将CSS嵌入页面本身的代码中,否则几乎总是更好(并且它被认为是最佳实践)链接到两者之间的外部样式表您的<head>代码(<head> <link rel="stylesheet" href="[YOUR STYLESHEET]" type="text/css"> </head>)。它使您的HTML更清晰,并有助于分离标记(HTML),样式(CSS)和功能(JavaScript)。

希望能在某种程度上回答你的问题,哈哈。