2016-12-06 62 views
0

我有一個詞語網站,其中用戶爲其原始網站定義配置。現在,用戶已將<td>的字體設置爲comic sans ms。當網站呈現時,它工作得很好。然而,在<td>元素之一中也有一個按鈕。這並不尊重<td>字體。由於它是一個基於動態(配置)的網站。我沒有很多的靈活性。如何強制將字體家族級聯到​​標籤中的按鈕元素

FIDDLE SAMPLE

我發現谷歌的一個解決方案,它說我要補充font-family: inherit到按鈕元素。有什麼方法可以將字體強制級聯到所有子元素,無論如何我不需要改變button element中的任何內容或進行一些微小的更改。

<table border=1> 
<tr><td> test 1 </td></tr> 
<tr><td> test 2 </td></tr> 
<tr><td> test 3 </td></tr> 
<tr><td> test 4 </td></tr> 
<tr> <td><input type="button" style="width:130px;" value="Reserve"> </td></tr> 
</table> 


TD{font-family: Comic Sans MS; font-size: 10pt;} 
+0

任何使用Comic Sans字體有沒有權利改變網站。請向他們解釋大約20年前字體已過時(學齡前除外):) –

+0

我會寫一個JavaScript警告..:D如果我只是想在字體家族上應用級聯,而不是在任何其他風格。這也是可能的。請指導我。我的意思是按鈕上的級聯應該只是font-family屬性。用簡單的英文選項1:'td,td *僅用於font-famiy'選項2:'td,td inputtype [button]但僅適用於font-family' – Unbreakable

回答

3

以下內容應完成工作。

TD, 
TD * 
{ 
    font-family: 'Comic Sans MS'; 
    font-size: 10pt; 
} 

更新,每次你的第三個問題。我猜你正在修改風格到第三方應用程序,你沒有能力改變HTML?以下是開始有點哈克,但工程。

第一個定義將樣式應用於表格單元格和單元格的所有子元素,除了具有一種按鈕類型的樣式。第二個定義僅將樣式應用於具有一種按鈕類型的表格單元格的子元素。

TD, 
TD *:not([type=button]) 
{ 
    color: rgba(255, 0, 0, 0.9); /* example purposes */ 
    font-family: 'Comic Sans MS'; 
    font-size: 10pt; 
} 

TD input[type=button] 
{ 
    font-family: 'Comic Sans MS'; 
} 
+0

下面的答案建議,我只需要一個帶*的TD。那就是那個okey。或者我應該遵循你的方法? – Unbreakable

+0

此外,如果我只是想要'按鈕'。我們有這個黑客嗎? – Unbreakable

+1

'TD'將以該標籤爲目標。 「TD *'將針對其子女。 – mhatch

2

定位按鈕專門爲您的系統選項?或者只針對td內的所有內容

TD * {font-family: Comic Sans MS; font-size: 10pt;} 
+0

Wauw。有效。謝謝你,先生! – Unbreakable

+0

我想瞄準'​​' – Unbreakable

+0

裏面的所有內容另外,如果我只是想瞄準按鈕。我們有這個黑客嗎? – Unbreakable

1
input, select, textarea, button { 
    font-family: inherit; 
} 

只是要確保目標的所有表單元素這樣:-)

小提琴:https://jsfiddle.net/mLoqLv0h/1

+0

感謝您的回覆。其實我正在尋找一些解決方案,我不需要改變按鈕元素。 :) – Unbreakable