<style>不适用，我不知道为什么

-1

我有一点非常基本的HTML，并试图用内联样式设计div。第一个片段通过将样式放在head元素中工作，但其他片段完全不起作用。什么是推理？<style>不适用，我不知道为什么

作品

<!DOCTYPE html> 
<html> 
<head> 
    <style> 
     #click-me { 
      background-color: red; 
      width: 200px; 
      height: 200px; 
     } 
    </style> 
</head> 
<body> 
    <div id='click-me'></div> 
    <iframe src='//someURL' width=800 height=600> 
</body> 
</html>

不工作

<!DOCTYPE html> 
<html> 
<head> 

</head> 
<body> 
    <div id='click-me'></div> 
    <iframe src='//someURL' width=800 height=600> 


    <style> 
     #click-me { 
      background-color: red; 
      width: 200px; 
      height: 200px; 
     } 
    </style> 
</body> 
</html>

来源

2014-10-08 iOnline247

你为什么不直接使用css文件呢？是的，在某些情况下，添加内联css可能会很方便，但我不明白为什么在这里？ – 2014-10-08 13:25:47

这完全是一个例子。只是想知道为什么它失败。 – iOnline247 2014-10-08 13:33:43

你<style>标签是标签内，因此不解析为母体的一部分文件。

添加</iframe>它应该工作。

来源

2014-10-08 13:26:44 SLaks

是的，未封闭的iframe可能是它不工作的原因，但'style'标签不应该放在首位。 – Guffa 2014-10-08 13:28:15

哈，斑点！ +1 – 2014-10-08 13:28:29

非常好的答案！完全地注意到...非常感谢！我会在6分钟内接受它现在不允许我使用的。 – iOnline247 2014-10-08 13:31:27

的style元件设计成只在你的HTML文档的head元素（其中，元数据预期）放置内。

如果你想使用内嵌样式，你应该这样做，而不是：

然而，这通常是在为造型应包含易于维护的样式表中皱起了眉头。

编辑：这并不在你的情况下，工作的原因是覆盖在SLaks'答案在这里：https://stackoverflow.com/a/26258094/1317805

来源

2014-10-08 13:24:28

无论如何HTML5引入_scoped style_：http://html5doctor.com/the-scoped-attribute/有些浏览器在元素本身定义时应用该样式 – fcalderan 2014-10-08 13:26:08

实际上，'

<style>不适用，我不知道为什么

回答