回答編集履歴
1
内容追記
answer
CHANGED
|
@@ -6,4 +6,29 @@
|
|
|
6
6
|
・・省略・・
|
|
7
7
|
</header>
|
|
8
8
|
|
|
9
|
-
で統一するとか？
|
|
9
|
+
で統一するとか？
|
|
10
|
+
|
|
11
|
+
Block-Element-Modifierの概念で考えれば、
|
|
12
|
+
このケースであればルートにあたるBlockをそもそも分ける理由がありません。
|
|
13
|
+
もし仮にtopとblogで微妙なバリエーションの違いがあるのであれば、
|
|
14
|
+
Modifierで対応するべきケースとなるので、例えば
|
|
15
|
+
|
|
16
|
+
<header class="site-header__top" role="banner">
|
|
17
|
+
・・省略・・
|
|
18
|
+
</header>
|
|
19
|
+
|
|
20
|
+
<header class="site-header__blog" role="banner">
|
|
21
|
+
・・省略・・
|
|
22
|
+
</header>
|
|
23
|
+
|
|
24
|
+
のような感じにすれば良いのでは。
|
|
25
|
+
この場合.site-header__topと.site-header__blogでは
|
|
26
|
+
書かれるCSSはほとんど同じになるでしょうが、完全に手書きでBEMるなら
|
|
27
|
+
その辺の冗長性は許容する必要があるかと思います。
|
|
28
|
+
（Sassとか使えればそのへんは@extendとかで解消できそうですが。）
|
|
29
|
+
|
|
30
|
+
個人的にはこの辺がシングルクラスベースのBEMに馴染めない理由なので
|
|
31
|
+
Block-Element-Modifierの概念自体は参考にしながら、
|
|
32
|
+
多少のマルチクラス併用は許容するくらいにして運用したい派です。
|
|
33
|
+
まぁその辺は突き詰めると宗教戦争になりかねないので、
|
|
34
|
+
あくまで個人の好みの問題ですけどね。
|