如何使用CSS調整表格的第一個單元格的寬度

我有如下所示的html結構。如何使用CSS調整表格的第一個單元格的寬度

<style> 
.divcontainer 
{ 
    width:100% 

} 
.left_menu { 
    background: none repeat scroll 0 0 #333333; 
    border-radius: 5px 5px 5px 5px; 
    font-family: Arial,Helvetica,sans-serif; 
    font-size: 12px; 
    font-weight: bold; 
    padding: 5px; 
    width: 200px; 
} 

</style> 
<div class="divcontainer"> 
    <table width="100%"> 
     <tr> 
      <td valign="top"> 
       <div class="left_menu"> 
        1 
       </div> 
      </td> 
      <td> 
       <div> 
        2</div> 
      </td> 

     </tr> 
    </table> 
</div>

我需要建立一個結構如下 sample

的圖片，但我不希望樣式應用於TD。 td的寬度應通過應用於子div的類進行調整。總之，我的第一個td應該佔用tr的25％，第二個佔用剩下的75％。有誰可以告訴我如何做到這一點？

來源

2014-06-22 Tom Cruise

您可以設置第二個td hudge width。然後它將採用最大寬度，首先td將收縮到其內容。 http://jsfiddle.net/f5q3E/

basicly在這裏你需要設置：

td { 
    background:red; 
} 
td+td { 
    width:100%; 
    background:blue; 
}

首個TD將調整其內容和大小的DIV如果有第二個TD將利用剩餘的空間。

來源

2014-06-22 14:11:33

很大。正是我在找什麼。多一個查詢。我如何可以提到這個特定的div？即我需要將以上樣式應用於div divcontainer。 –

你是什麼意思，給容器？ –

我明白了。 .divcontainer td { background：red; } .divcontainer td + td { width：100％; 背景：藍色; }做了伎倆。謝謝。 –

有很多方法可以解決這個問題 - 這裏有一個 - FIDDLE - 它並沒有比任何其他方法更好。

我對你的tds的着色以及進入它們的div的着色有點困惑。

如果你能告訴我們你想要做什麼的目標，也許我們可以提出一些其他建議，比如不使用table來佈局divs？浮動divs？

CSS

table tr td:nth-child(1) { 
    width: 25%; 
    background-color: red; 
} 
table tr td:nth-child(2) { 
    width: 75%; 
    background-color: blue; 
    color: white; 
}

來源

2014-06-22 14:21:57 TimSPQR

如何使用CSS調整表格的第一個單元格的寬度

回答

相關問題