Fatal编程技术网
  • css/
  • Css 虽然使用直接后代选择器，但仍应用于子级的属性&燃气轮机&引用；

Css 虽然使用直接后代选择器，但仍应用于子级的属性&燃气轮机&引用；

css

Css 虽然使用直接后代选择器，但仍应用于子级的属性&燃气轮机&引用；,css,Css,我正在使用.class>ul>li 基本上，我想知道为什么有些属性按预期工作（如border），而另一些属性如text transform、color或font size会影响列表中的列表 这里有一个例子： 我发现使用.class ul li ul li来“撤销”第一个直接子项上所需的文本样式的需要非常烦人 任何与文档相关的链接，如果能让我了解此选择器的实际工作原理，我将不胜感激。我认为您的HTML嵌套是不正确的，因此它将li中的整个ul视为该li的内容。试试这个： <div class=

我正在使用
.class>ul>li

基本上，我想知道为什么有些属性按预期工作（如
border
），而另一些属性如
text transform
、
color
或
font size
会影响列表中的列表

这里有一个例子：

我发现使用
.class ul li ul li
来“撤销”第一个直接
    • 子项上所需的文本样式的需要非常烦人

    任何与文档相关的链接，如果能让我了解此选择器的实际工作原理，我将不胜感激。

    我认为您的HTML嵌套是不正确的，因此它将li中的整个ul视为该li的内容。试试这个：

    <div class="menu ">
    <ul>
        <li>This is uppercase red</li>
        <ul>
            <li>this should not be uppercase or red</li>
            <li>this should not be uppercase or red</li>
            <li>this should not be uppercase or red</li>                
        </ul>   
    </ul>
</div>

    

      

    • 这是大写的红色
      • 

        

      • 这不应该是大写或红色
        • 

      • 这不应该是大写或红色
        • 

      • 不应为大写或红色
        •
    这是一种被称为继承的正常行为 一些css属性是从其父级继承的，而另一些则不是

    遗产 未在上指定继承属性的值时 元素，该元素在其上获取该属性的计算值 父元素。只有文档的根元素才能获得初始值 属性摘要中给定的值。[]

    继承属性列表 摘自2015年3月17日

    all
    属性 此属性允许使用
    initial | inherit | unset
    值控制CSS继承：

    CSS all shorthand属性重置除 unicode bidi和方向设置为其初始值或继承值。[]

    此属性当前的状态为“候选推荐”，但（safari除外）已实现该属性

    对于您的示例： 
    border
    属性不继承，因此尽管父元素继承，子元素也不会有border事件

    但是
    字体大小
    、
    颜色
    和
    文本转换
    是继承到子元素的属性。因此，第二级列表项与其父项具有相同的
    字体大小
    、
    颜色
    和
    文本转换

    结论：
    您使用的选择器是正确的，仅针对第一级列表项，但某些属性（如
    color
    ）将继承到第二级列表项。

    由于您没有为内部
    ul
    定义样式，因此将具有与其父级相同的样式

    你要做的是把文本包装成一个空格

    <div class="menu ">
  <ul>
    <li><span>This is uppercase red</span>
        <ul>
            <li>this should not be uppercase or red</li>
            <li>this should not be uppercase or red</li>
            <li>this should not be uppercase or red</li>                
        </ul>
    </li>
  </ul>
</div>

    

      

    • 这是大写的红色

        

      • 这不应该是大写或红色
        • 

      • 这不应该是大写或红色
        • 

      • 不应为大写或红色
        • 

      

      •
    并将css定义应用于
    .menu>ul>li>span

    您的目标是.menu>ul>li。 这是正确的，但是在.menu>ul>li中有一个ul

    因此，目标+子女将受到财产的影响

    考虑以下HTML：

    <body>
 <h1>Example</h1>
 <div class="sub">test</div>
</body>
    这里，h1和div.sub都将使用calibri字体。

    您使用的属性（除了边框）都是可继承的。这里有一个解决方法：不，您将ul直接放在另一个ul下，这是不对的。使用@sdcr，您不能将
    ul
    直接嵌套在另一个
    ul
    内<代码>ul元件仅接受
    li
    元件作为children@adam我也这么认为，但根据W3C，这也是有效的。@SCHTAILian不这么认为，在MDN上，它说“允许内容为零或更多
  • 元素，最终与和
      元素混合。”我实际上对验证器进行了测试，它说“在此上下文中，元素ul不允许作为元素ul的子元素。”@sdcr和adam确实找错了地方，我的错。是的，为了支持这一点，只需添加
      li{color:green；}
      将使其他
      li
      元素具有绿色前景。Ty。我想我必须习惯在css表上添加一些以前的说明（如在重置表中）这样：不是最理想的解决方案，但已经足够好了。有没有可能您有一个链接，其中包含默认继承的整个css属性列表？（似乎找不到，但我会继续查找）.任何人都可以，谢谢你time@AlvaroMen很抱歉，安德兹找不到比W3.org上的表更好的列表。在获得更好的浏览器支持之前，您的解决方案似乎是可行的。@web tiki您能提出一个解决方案吗？我对这个问题非常感兴趣。@AlvaroMen安德兹我从W3.org中提取了一个继承属性列表参考表格并在答案中编辑它。
      span
      元素是不必要的。嗯……回答这个问题是必要的（正是op觉得“撤销”以前定义很烦人的部分）……但是如果你能告诉更多，不要犹豫；-） 
      <body>
 <h1>Example</h1>
 <div class="sub">test</div>
</body>

         body
   {
    font-family:calibri;
   }