以數字開頭的CSS類沒有得到應用

我試圖創建一個包含圖像的網頁。但是，我希望所有圖像都具有相同的大小和格式。我有以下CSS類適用於div和中心和大小的圖像：以數字開頭的CSS類沒有得到應用

.img-container { 
    border: thin solid #C4C4C4; 
    border-radius: 10px; 
    overflow: hidden; 
    margin-left: auto; 
    margin-right: auto; 
}

但是，我的圖像將在整個頁面有不同的尺寸。因此，我想擁有的只是高度和寬度不同的類，像這樣：

.200-200 { 
    width: 200px; 
    height: 200px; 
}

當我申請這兩個類到div如下：

<div class="img-container 200-200"><img></div>

的高度和寬度不似乎適用。我能做些什麼來讓這些課程分開嗎？

來源

2017-07-25 Jck

類不應該以數字開頭 – jt25

[是否有一種解決方法可以使CSS名稱以數字開頭的名稱有效？]（https://stackoverflow.com/questions/21227702/is-there-a -workaround-make-css-classes-with-names-that-start-with-numbers-val） – 2017-07-25 03:48:55

對於開始用數字類，你需要寫

.\32 00-200 { 
    width: 200px; 
    height: 200px; 
}

你可能想避免這樣做。

\32代表數字「2」。後面的空格是終止轉義序列所必需的。

原因是「CSS標識符」可能不以數字開頭。在CSS中，選擇器中使用的類名稱被認爲是「CSS標識符」。因此，必須按照上面所示的方式逃過領先號碼。請注意，HTML透視圖對類名沒有限制，除了它們可能不包含空格。所以你可以編寫<div class="%^*+<"，只要你願意弄清楚如何在你的CSS文件中以轉義形式編寫它。

查看question suggested as a duplicate瞭解更多信息。

來源

2017-07-25 03:47:01

good job.upvote – Ehsan

這樣做。謝謝！ – Jck

CSS類名不應該以數字開頭（除非你願意做@torazaburo's answer所描述的）。所以也許改變這個，即班級名稱從「200-200」改爲「s200-200」。

.200 { 
 
    color: red; 
 
} 
 
.s200 { 
 
    color: red; 
 
}

<div class="200">I'm not red :(</div> 
 
<div class="s200">I am red :)</div>

來源

2017-07-25 03:45:46

你不應該開始的類名稱與數字preferably.for修復它，改變類的名稱。

.img-container { 
 
    border: thin solid #C4C4C4; 
 
    border-radius: 10px; 
 
    overflow: hidden; 
 
    margin-left: auto; 
 
    margin-right: auto; 
 
} 
 

 
.c200 { 
 
    width: 200px; 
 
    height: 200px; 
 
}

<div class="img-container c200"><img></div>

來源

2017-07-25 03:46:42 Ehsan

以數字開頭的CSS類沒有得到應用

回答

相關問題