<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>不適用，我不知道爲什麼

回答