真的看了各種規(guī)範(fàn)以及各種大牛的見解已經(jīng)不會(huì)寫 css 了 ~
個(gè)人不太喜歡原子類別 且語意化(可能還不理解)也有一些問題
如題例如果我有一塊列表樣式和newsList 相同但內(nèi)容並不是放新聞的話該怎麼辦是的css 預(yù)處理器是可以解決但只能這樣嗎… 如果我的命名不是newsList 而是list 呢是否違背了語意化呢我確實(shí)表述了這塊是個(gè)列表啊復(fù)用也就不成問題了
如果之後我要定義一個(gè)列表呢list2 嗎…… 這個(gè)問題我也在各類規(guī)範(fàn)定義modifier 狀態(tài)的時(shí)候存在如果一個(gè)組件存在一個(gè)modifier 這個(gè)modifier 和基類的區(qū)別是有個(gè)margin-top 那麼到底該如何去命名呢？
一個(gè)模版頁的所有區(qū)塊都該怎麼命名…
header 這個(gè)命名我都覺得太具體 如果網(wǎng)站改版 我要把之前的 header 當(dāng) footer 用的話…
我還有救嗎？ ~
3
0
0
語意化本來就是用來確定語意。
你說的 header 要改成 footer 這種情況，根本就不屬於語意確定，當(dāng)然不適合語意化。
但是你可以在能預(yù)見的情況下，分離出已確定部分的語意。話卽，語意化是有已知前提的。
個(gè)人認(rèn)為，CSS class 的命名，和設(shè)計(jì)稿有很高的關(guān)聯(lián)。
比方說，設(shè)計(jì)稿的 A、B 兩個(gè)清單擁有不同的 margin-top，那麼就需要和設(shè)計(jì)師確認(rèn)，是設(shè)計(jì)疏漏了，還是別有用心。
如果理解好了設(shè)計(jì)稿的意圖，那麼命名 CSS class 就有據(jù)可依。
舉例：
（假設(shè)第二個(gè)模態(tài)框叫做“添加”，沒找到合適的設(shè)計(jì)稿，自己 P 的）
這是兩個(gè)模態(tài)框，
我發(fā)現(xiàn)有它們模態(tài)框都是採用同樣的字體、顏色等，但是描述裡一個(gè)是和 icon 居中，一個(gè)是和 icon 頂部齊平。
那麼一開始，我會(huì)採用以下命名：
<article class="delete-modal base-modal"></article>
<article class="add-modal base-modal"></article>當(dāng)我發(fā)現(xiàn)，有更多的設(shè)計(jì)稿是一行文字則描述居中，多行文字則描述頂部齊平，那麼我會(huì)採用以下的命名：
<article class="one-line-modal base-modal"></article>
<article class="multi-line-modal base-modal"></article>以上例子，就是我的想說的，CSS 命名需要根據(jù)設(shè)計(jì)稿的意圖出發(fā)。
有時(shí)候，犯錯(cuò)的未必是前端，可能是設(shè)計(jì)。
