0
私はBEM規則についていくつかの説明をしたいと思います。 2つの場所/ページregistration
とdashboard
で使用されるカードブロックがあるとします。私はかつてこのためscss
を書き、その後、私はそれを必要な場所にそれを使用できるようにしたいと思いBEM:命名規則
<div class="card">
<header class="cardheader">
<h3 class="cardheader_title">
Some Title
</h3>
</header>
<section class="card-body">
<!-- this can contain other blocks. -->
<!-- for example a nav and a form. or simple an acticle -->
</section>
</div>
:カードの
HTML構造は次のようになります。例えば、登録ページを見てみましょう。
<div class="card registration-card">
<header class="cardheader registration-cardheader">
<h3 class="cardheader_title registration-cardheader__title">
Some Title
</h3>
</header>
<section class="card-body registration-cardbody">
<!-- this can contain other blocks. -->
<!-- for example a nav and a form. or simple an acticle -->
</section>
</div>
そしてダッシュボードのために同じことを繰り返します。私は上記の例
にblock
とblock__modifer
で働いています
<div class="card dashboard-card">
<header class="cardheader dashboard-cardheader">
<h3 class="cardheader_title dashboard-cardheader__title">
Some Title
</h3>
</header>
<section class="card-body dashboard-cardbody">
<!-- this can contain other blocks. -->
<!-- for example a nav and a form. or simple an acticle -->
</section>
</div>
はacceptable
BEMアプローチの上ですか?