颜色不被子元素继承？

我试着尽可能简化下面的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

颜色不被子元素继承？

回答

相关问题