顏色不被子元素繼承？

我試着儘可能簡化下面的HTML。爲什麼CSS屬性color: #01FFDD;被嵌套表的所有元素忽略？使用<div>的嵌套CSS一般適用於我，但不適用於此。難道我做錯了什麼？顏色不被子元素繼承？

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
     <title></title> 
     <style type="text/css" > #features{color: #01FFDD;}  </style> 
    </head> 

    <body> 
     <table border="1"> 
      <tr> 
       <td> 
        <div id="features"> 
         <h2>FEATURES</h2> 
         <table border="1"> 
          <tr> 
           <td> 
            <h2>HEADING 1</h2> 
            <p> SOME TEXT</p> 
           </td> 
           <td> 
            <h2> HEADING 2</h2> 
            <p>SOME TEXT</p> 
           </td> 
          </tr> 
         </table> 
        </div> 
       </td> 
      </tr> 
     </table> 
    </body> 
</html>

來源

2011-09-21 samin

[對我的作品（http://jsfiddle.net/R9dcC/）！ – Alex

對我來說工作很好。你在期待什麼？ – JohnFx

你爲什麼要嵌套表格？ – Blender

這似乎是問題的一個怪癖模式型，至少我複製它在Safari 5.1 - 取決於DOCTYPE，該UA樣式表包含規則

table { 
    white-space: normal; 
    line-height: normal; 
    font-weight: normal; 
    font-size: medium; 
    font-variant: normal; 
    font-style: normal; 
    color: -webkit-text; 
    text-align: -webkit-auto; 
}

注意color屬性。

爲了避免這種情況，改變你的<!DOCTYPE>官方W3C推薦的HTML 4.01過渡：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
     "http://www.w3.org/TR/html4/loose.dtd">

來源

2011-09-21 01:11:16

好的，那太棒了。這對於新手來說非常有趣。 – samin

試試這個：

<style type="text/css"> #features, #features table{color: #01FFDD;} </style>

來源

2011-09-21 01:02:43 Aaron

這絕對有效。你知道爲什麼它不能以另一種方式工作嗎？ – samin

顏色不被子元素繼承？

回答

相關問題