將混合的內部和內聯樣式轉換爲內部

我有下面的一些內部和內聯樣式表。它適用於我，但最近我注意到表格格式化被破壞（內聯樣式被主站點的樣式覆蓋並停止工作，僅應用了字體的內部樣式）。如何正確地將這些混合的內部和內聯樣式轉換爲內部樣式？它會更好地使用ID選擇器而不是類？將混合的內部和內聯樣式轉換爲內部

CSS： table.myTable td, th { font-size:14px; }

HTML：

<table class="myTable" style="border-collapse:collapse;" align="left" border="1" cellpadding="4" cellspacing="0"> 
    <tbody> 
     <tr> 
      <td rowspan="3">..</td> 
      <th>aaaa</th> 
      <th>bbbb</th> 
      <th>cccc</th> 
     </tr> 
     <tr> 
      <td>data</td> 
      <td>data</td> 
      <td>data</td> 
     </tr> 
     <tr> 
      <td>data</td> 
      <td>data</td> 
      <td>data</td> 
     </tr> 
    </tbody> 
</table>

編輯：這個CSS工作對我來說：

table.myTable {border-collapse: collapse;} 
table.myTable th, table.allsizes td {border: 1px solid #cccccc;} 
table.myTable td,th {padding: 5px;} 
table.myTable td,th {font-size: 14px;}

<table class="myTable">

來源

2014-12-28 sonex

你是什麼意思的「內部風格」？ –

內部樣式 - css進入head標籤。我的模板沒有html，head和body標籤，所以我把css放在body中（所以認爲它是「內部的」） – sonex

@sonex你解決了嗎？ –

table.myTable {border-collapse: collapse;} 
table.myTable th, table.allsizes td {border: 1px solid #cccccc;} 
table.myTable td,th {padding: 5px;} 
table.myTable td,th {font-size: 14px;}

來源

2014-12-29 10:41:06 sonex

，如果你是你不應該使用的ID去一個在單個頁面上的多個區域中添加樣式。如果你的樣式被破壞，那麼在<head>標籤或外部樣式表文件中設置一個類並在其中應用你的屬性。這樣你可以避免任何衝突。

保持簡單，並嘗試在外部樣式表中完成所有樣式，如果要多次應用屬性，請使用類。如果你有一個與你競爭的iframe，那麼你可以嘗試!important功能 - 不是最優雅的解決方案，但如果它不應用於iframe之外的上述css，那麼它將工作。

另一個更好的解決方案是使用JQuery使用.css（）函數更改css，如下所示：$(".myTable").css("font-size", "14px");。或者，如果可以的話，給你的表一個獨特的類名，這個名字不會與給你上面的iframe的任何css類名衝突。

來源

2014-12-28 20:07:09

放置在主站點內的幀內容。 html，head，body標籤不能使用。 – sonex

你是說你的HTML是在一個iFrame中，並且上面的頁面中的CSS與你的iFrame中的內容衝突？ –

是的，父頁面（主站點）包含** iframe **，而我的HTML頁面實際上是在此iframe中調用的子頁面。主站點的CSS可能會與我的CSS發生衝突。有時表格格式化恢復正常，一切看起來都正確。 – sonex

將混合的內部和內聯樣式轉換爲內部

回答

相關問題