什麼是命名CSS選擇器的正確方法。它看起來不一致如何工作

我在一個名爲ProductDetailsEditButton的細節視圖中將一個樣式應用於buttonfield。我認爲選擇器的名稱因此是td .ProductDetailsEditButton，但這不起作用。但是，當我將它稱爲td.ProductDetailsEditButton（沒有空格）時，它確實有效。什麼是命名CSS選擇器的正確方法。它看起來不一致如何工作

兩者之間是否必須有空格？情況總是如此，還是取決於？對不起，但它在命名約定中似乎不一致，我想知道我忽略了什麼。

來源

2011-12-15 The Vanilla Thrilla

當存在空格時，表示選擇器將匹配<td>的子元素class="ProductDetailsEditButton"。例如：

<td> 
    <div class="ProductDetailsEditButton">Button</div> 
</td>

當沒有空格時，它將匹配<td class="ProductDetailsEditButton">。

來源

2011-12-15 16:07:14

如果我在'`中插入了一個按鈕並直接將css類應用於該按鈕，該怎麼辦？我會不會`td.ProductDetailsEditButton`或者它會像`td input.ProductDetailsEditButton`？ – 2011-12-15 16:17:53

@TheVanillaThrilla，你可以簡單地使用`.ProductDetailsEditButton`。它將匹配這個類的所有元素。如果你想要更具體一些，你可以'td input.ProductDetailsEditButton`假設爲'` – 2011-12-15 16:18:23

這些是兩個單獨的東西：

td .ProductDetailsEditButton

裝置「與類ProductDetailsEditButton一個元素是一個td孩子」

td.ProductDetailsEditButton

裝置「與類ProductDetailsEditButton一個td元件」

來源

2011-12-15 16:07:21

在你的選擇器中，你指的是「td」，你是在實際對接上設置的類在元素上還是在父td容器上設置？如果它被設置在您的按鈕，只有該按鈕，你將能夠使用

input.ProductDetailsEditButton

引用它在你的CSS，如果你想成爲非常具體的或乾脆

.ProductDetailsEditButton

如果可以應用它到按鈕以外的其他元素

來源

2011-12-15 16:08:54 mreyeros

當您在td .ProductDetailsEditButton之間使用空格時，您說給我一個td子項的ProductDetailsEditButton。

當你沒有空格寫上td.ProductDetailsEditButton你說給我帶有ProductDetailsEditButton類的td。

來源

2011-12-15 16:08:55

什麼是命名CSS選擇器的正確方法。它看起來不一致如何工作

回答

相關問題