정말 다양한 스펙과 다양한 전문가들의 의견을 읽어보니 이제 CSS를 어떻게 쓰는지 모르겠습니다~
개인적으로 나는 원자 클래스를 별로 좋아하지 않으며 의미론에 몇 가지 문제가 있습니다(아직 이해하지 못할 수도 있습니다)
예를 들어 newsList와 같은 스타일의 목록이 있는데 내용이 뉴스가 아닌 경우 어떻게 해야 하나요? 네, CSS 전처리기가 해결해 주는데 이 정도밖에 안 될까요... 내 이름이 뉴스가 아니면 어떻게 해야 할까요? newsList인데 list, 규칙을 위반하는 건가요? 의미론적으로 이 글은 목록이라고 명시했으므로 재사용은 문제가 되지 않습니다
나중에 목록을 정의하고 싶으면 어떻게 하나요? list2... 이 문제는 다양한 사양이 수정자 상태를 정의할 때에도 발생했습니다. 구성 요소에 수정자가 있는 경우 이 수정자와 기본 클래스의 차이점은 마진이 있다는 것입니다. top. 그럼 이름은 어떻게 정해야 할까요?
템플릿 페이지의 모든 블록 이름을 지정하는 방법...
헤더 이름이 너무 구체적인 것 같아요. 홈페이지가 수정되어 이전 헤더를 바닥글로 사용하고 싶다면...
그래도 구원받을 수 있나요? ~
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
定个基类，然后继承
語義化本來就是用於確定語義。
你說的 header 要改成 footer 這種情況，根本就不屬於語義確定，當然不適合於語義化。
但是你可以在能預見的情況下，分離出已確定部分的語義。話卽，語義化是有已知前提的。
个人认为，CSS class 的命名，和设计稿有很高的关联。
比方说，设计稿的 A、B 两个列表拥有不同的 margin-top，那么就需要和设计师确认，是设计疏漏了，还是别有用心。
如果理解好了设计稿的意图，那么命名 CSS class 就有据可依。
举个例子：
（假设第二个模态框叫做“添加”，没找到合适的设计稿，自己 P 的）
这是两个模态框，
我发现有它们模态框都是采用同样的字体、颜色等，但是描述里一个是和 icon 居中，一个是和 icon 顶部齐平。
那么一开始，我会采用以下命名：
当我发现，有更多的设计稿是一行文字则描述居中，多行文字则描述顶部齐平，那么我会采用以下的命名：
以上例子，就是我的想说的，CSS 命名需要根据设计稿的意图出发。
有时候，犯错误的未必是前端，可能是设计。