覆蓋html css中的跨度並使用TD

我在<td>中有一個span標記。在<td>中，我使用該類來設置字體。但是，span有它自己的字體樣式。我想覆蓋span標籤中的字體樣式並強制標籤中的字體設置。我不知道如何去做，因此請告知。覆蓋html css中的跨度並使用TD

.set_font 
{ 
    font-size:12px; 
} 
<table> 
    <tr> 
     <td class="set_font"> 
      <span style:"font-size:8px;"> This is a test </span> 
     </td> 
    </tr> 
</table>

來源

2014-03-05 user728148

您是否在''css中嘗試'！important'？ –

你必須在樣式屬性'上使用「=」，而不是「：」這是一個測試' – Seb33300

是的，我做過。我在.set_font {font-size：12px;！important}中添加了它，但它沒有工作:( – user728148

在CSS選擇器中，應用了最接近實際元素的元素。所以在使用選擇器覆蓋樣式時應該更具體一些。

在您的示例中，span元素具有最高特異性的內聯樣式。

爲了獲得更高的特異性，然後直接對風格的元素外，你應該使用[風格]和重要。
您可以強制一組對TD這樣的：

td.set_font [style] {font-size:120px !important;}

這裏工作JSFiddle

來源

2014-03-05 02:01:25

很好的解釋。 Upvoted，因爲你是第一個清楚地描述需要改變CSS選擇器_and_ use！important。另外，感謝在你的例子中使用比4px更大的字體大小差異:) –

:)我很樂意提供幫助。 –

你能解釋更多嗎？我無法完全遵循 – user728148

對跨度使用單獨的類。

CSS：

.set_font 
    { 
     font-size:12px; 
} 

.font2{ 
    font-size:8px; 
}

HTML：

<table> 
<tr> 
<td class="set_font"> 
    <span class="font2"> This is a test </span> 
</td> 
</tr> 
</table>

來源

2014-03-05 01:49:44

樣式是由我的程序中的編輯器生成的。我不能在編輯器中更改字體，但想要強制將樣式設置在td中。 – user728148

添加以下CSS。

.set_font span { 
    font-size: 12px !important; 
}

來源

2014-03-05 01:58:09 Iqbal

謝謝，但是我不能將css添加到span標記中，因爲標記是由第三方工具生成的 – user728148

將那個CSS添加到樣式表中不要錯誤地添加「！important」 – Iqbal

這是基本相同伊克巴爾的答案，但這個問題的解釋（和正確的解釋，如與當前接受的答案相反）：

當您需要覆蓋style屬性中的CSS設置，並且無法修改HTML源代碼時，您需要編寫一個CSS規則：a）引用您希望的特定元素風格（不是它的父母）和 b）使用!important說明符（這通常應該避免，但這裏不能避免）。原因是在CSS cascade中，style屬性中的任何CSS聲明比使用style元素或鏈接的樣式表中的CSS規則獲得的任何CSS特性具有更高的特異性。因此，覆蓋此規則的唯一方法是使用!important。

此外，您需要一個適用於手頭元素的規則。在你試過的div父設置屬性不可能幫助，因爲span永遠不會從任何樣式表中設置屬性時繼承它的父屬性。

因此，例如，

.set_font span { font-size: 12px !important }

將強制執行（該作者樣式表可以執行任何的程度）和span元件上的12像素的字體大小。如果span元素可能有時通過一些其他元素所替代，您可以使用

.set_font * { font-size: 12px !important }

使任何後代細胞的採取12px的字體大小（這是一件好事，你不應該被設定，但我離題了）。爲了使剛剛任何孩子（直系後代）有大小，你可以使用

.set_font > * { font-size: 12px !important }

（略有減少瀏覽器的覆蓋率）。

當然，您將這樣的CSS規則放在style元素中，或者更好的是放置在從HTML文檔鏈接的外部樣式表中。這些都不需要對td元素中的HTML標記進行任何更改。

來源

2014-03-05 22:42:47

覆蓋html css中的跨度並使用TD

回答

相關問題