CSS類名后面隔著一個(gè),是一種比較常見的代碼風(fēng)格。對(duì)于前端開發(fā)人員來說,遵循這種風(fēng)格有利于提高代碼的可讀性和易維護(hù)性。
在CSS中,類名的使用非常頻繁。我們通常會(huì)將一些相似的樣式封裝成一個(gè)類,然后在HTML中使用class屬性來引用這個(gè)樣式。
.container { width: 100%; max-width: 1200px; margin: 0 auto; }
上面的代碼中,.container是一個(gè)類名,代表一個(gè)容器的樣式。這個(gè)類名后面隔著一個(gè)空格,接著就是樣式定義。
為什么要在類名后面隔開一個(gè)空格呢?這是因?yàn)镃SS語法中,選擇器可以包含多個(gè)標(biāo)識(shí)符,中間用空格隔開。例如:
.container .title { font-size: 24px; font-weight: bold; }
這個(gè)規(guī)則表示,選擇器為.container .title的所有元素將應(yīng)用這個(gè)樣式。其中,.container和.title分別代表兩個(gè)不同的元素,它們之間用空格分隔。
遵循類名后面隔一個(gè)空格的風(fēng)格,可以讓我們?cè)趯慍SS樣式時(shí)更加清晰明了。同時(shí),也方便其他人在閱讀我們的代碼時(shí)理解我們的意圖。