子CSS樣式覆蓋

-1

應該我們有如下的Html結構。子CSS樣式覆蓋

<table class="main-tb"> 
<tr> 
<td> 
</td> 
<td id ="mytd"> 
</td> 
</tr> 
</table>

和應用的css文件定義如下。

.main-tb 
{ 
    font-size: 13px; 
    line-height: 20px; 
    padding: 5px 10px; 

} 
.main-tb th 
{ 
    background-color: #F8F8F8; 
    border-color: #CCCCCC -moz-use-text-color; 
    border-style: solid none; 
    border-width: 1px 0; 
    line-height: 22px; 
    padding: 5px 10px;  
} 

.main-tb td 
{ 
    border-color: #CCCCCC; 
    border-style: dotted; 
    border-width: 0 0 1px;/**/ 
    line-height: 22px; 
    padding: 5px 10px; 
}

我們可以看到.main-tb td樣式應用到表中的所有td元素。現在，如果我想將不同的樣式應用於其中一個名爲mytd的td元素，例如從.main-tb td中刪除邊框顏色和邊框寬度。那麼，我該怎麼辦？謝謝。

來源

2012-08-04 Joe.wang

#mytd比.main-tb td更具體，所以你只需從#mytd刪除邊框。

#mytd { 
    border: 0 none; 
}

來源

2012-08-04 05:45:34 Nightfirecat

使用!important爲什麼，如果我強行加個班樣式mytd元素.servertd { 邊境不起作用：0無; line-height：22px; padding：5px 10px; } – 2012-08-04 05:53:41

如果您具體，它會工作。嘗試'.main-tb .servertd {border：none; } – Chad 2012-08-04 06:07:39

任何人都可以爲我推薦一些好的css書籍。謝謝 – 2012-08-04 06:11:35

您可以簡單地選擇該元素與.main-tb td #mytd或#mytd（因爲ID是唯一的），並使用border: 0;刪除邊框。

來源

2012-08-04 05:45:56 fardjad

-1

的類

#mytd { 
    border-color: #fff !important; 
    OR 
    border-color: transparent !important;  
}

來源

2012-08-04 05:47:24

爲什麼它被降低了？ – 2012-08-04 05:50:14

+1 for！important，雖然將邊框顏色設置爲白色並不是移除它的最佳方法。 – fardjad 2012-08-04 05:57:22

-1 for！important。這是完全沒有必要的，因爲它已經比'.main-tb td'更高的特異性了，重要的可以很容易地混淆其他不會被覆蓋的樣式。 – Nightfirecat 2012-08-04 06:26:38

子CSS樣式覆蓋

回答

相關問題