CSS继承

.x-panel-myheader{overflow:hidden;zoom:1;color:#15428b;font:bold 11px tahoma,arial,verdana,sans-serif;padding:5px 3px 4px 3px; border:1px solid #99bbe8;line-height:5px;background: transparent url(../images/default/panel/white-top-bottom.gif) repeat-x 0 -1px;} 
.x-panel-myheader .x-panel-body { background-color: Transparent; } 
.x-panel-myheader .x-toolbar { background-color:inherit; border:0px ;} 

` 
<div class="x-panel x-panel-myheader x-border-panel x-panel-noborder" id="pnlHeader" style="width: 608px; top: 0px; left: 0px;"> 
    <div class="x-panel-bwrap" id="ext-gen62"> 
    <div class="x-panel-body x-panel-body-noheader x-panel-body-noborder" id="ext-gen63" style="width: 608px; height: 39px;"> 
     <div class="x-toolbar x-small-editor x-abs-layout-item" id="tbarTest" style="top: 17px; left: 5px;">

`CSS继承

怎么做CSS继承工作？我想申请一个不同的CSS div class =“x-toolbar” 不知道如何访问它。

来源

2009-05-14 user99322

简而言之，规则说，后来CSS声明覆盖前面的声明。 “样式”属性总是覆盖“类”属性。

如果覆盖一类级联若干个元素（.X-面板myheader .X-工具栏），你会覆盖时，它需要包括完整的“路径”。在您的样品将是：

.x-panel-myheader .x-toolbar { 
    /* new styles here */ 
}

但是，如果要覆盖在“样式”属性声明的东西，那么你可以追加重要标志或者你必须编辑样式本身！：

.x-panel-myheader .x-toolbar { 
    /* new styles here */ 
    background-color: #000 !important; 
}

更新：它看起来像你编辑了与X-面板myheader属性的div元素，所以我的例子不一定会用新的代码工作。

来源

2009-05-14 21:00:10 scotts

是的，我忘了将我的头包含在HTML中。在这种情况下，我将如何访问.x-工具栏？ – user99322 2009-05-15 12:35:27

在这种情况下，您应该可以使用上面提供的代码访问它。如果它不起作用，你试图改变什么风格？安装Firefox的Firebug扩展并查看特定HTML元素的HTML检查器并查看应用的CSS也是值得的。调试CSS问题非常有用。 – scotts 2009-05-16 05:39:44

应用不同风格的X工具栏的唯一方式是注入式的以前的定义了。这样你就可以覆盖以前的定义。

如果你有在源头控制，您可以通过不同的名称添加一个风格，只是把它在每一元素类列表。

来源

2009-05-14 20:59:35 NotMe

哪里有来自于你的CSS的-myheader？您的HTML中没有x-panel-myheader任何地方。

来源

2009-05-14 21:00:22 Greg

对不起！忘了拿到正确的名字。我现在在xss中包含了x-panel-myheader。 – user99322 2009-05-15 12:33:45

这个问题似乎是在CSS规则限定为适用于：

.x-panel-myheader .x-toolbar

这意味着，它将适用于任何有一类的“X-工具栏”，但只有如果它包含在其他具有“x-panel-myheader”类的其他内容中。

你的HTML没有显示出与类“X-面板myheader”任何东西，所以我不能确定这是否是什么导致您的问题或没有。如果CSS规则看起来不起作用，那可能是原因。如果你只是希望它适用于所有类型的“X工具栏”，将行改为：

.x-toolbar { background-color:inherit; border:0px ;}

来源

2009-05-14 21:04:40

回答

相关问题