具有多個子類的選擇器的HTML語法

Question

我想爲選擇器的多個子語言定義一個css規則。這裏是一個html的例子。

<div id="row1"> 
    <div class="col1"> 
    <div class="col2"> 
    <div class="col3"> 
</div> 
<div id="row2"> 
    <div class="col1"> 
    <div class="col2"> 
    <div class="col3"> 
</div> 

假設我想讓row1中的col1，col2，col3的寬度都一樣。我想這個CSS，但它沒有留下具體到ROW1：

#row1 .col1, .col2, .col3{ 
    width: 80px; 
} 

我也許可以添加＃ROW1盈每.COL的但難道不期待的那樣好。什麼是這樣做的正確方法？

Answer 1

這應該這樣做：

#row1 > div 
{ 
    width: 80px; 
} 

該規則適用於每一個div元素是#row1一個孩子。我指定了一個子選擇器（>），以防您嵌套div元素，您不希望規則適用。

Answer 2

我大概可以添加＃row1每個.col infront，但不會看起來不錯。什麼是這樣做的正確方法？

這是唯一的方法來做到這一點，至少得到你描述的規則。

你所擁有的標記，你可以得到相同的效果：

#row1 div