

小規模なサイトなのですが、ページが複数ありそのそれぞれでセクションのマージンの取り方が違う場合。  
クラス名などはどうしていますか？

[code]

    <section class="section01"></section>
    <section class="section01"></section>
    <section class="section01"></section>  ←これだけマージンが上下他と違う
    <section class="section01"></section>
    
[/code]

また、そのページ内で一つのブロックのみがマージンの取り方が違う場合はどうしますか？

[code]

    .mb10 {
      margin-bottom: 10px !important
    }
    
[/code]

を許可しますか？

また、見出しなどで、アンダーラインあるなしや、ボールドか、ボールドでないかなど、  
同じ文章構造でもページによって若干スタイルが異なる場合の命名を教えて欲しいです。

例えば、文字のボールドあるなしだと

[code]

    .txt_b ←ボールド
    .txt　←なし
    
[/code]

等です。  
この微妙なスタイルの違いにいつも命名を悩ませています。


CC BY-SA 3.0
2015-09-27T23:48:20.563
17006
2015-10-01T05:20:47.917
2015-09-28T04:14:44.320
4236
12471
question
css
css 命名の質問


セクションのうち特定のもののみマージンが異なる場合、その意味・理由にも依ると思います。
`mb10`という例から察するにセクションの内容に依存せず特定の位置のマージンを広くする必要があるなら、当該セクションには手を加えるようなことはせず、`<hr/>`タグを挟み、そちらでスタイルを指定する方法もあるかと。

* * *

ボールドについては`.txt_b`とせずHTML上で`<strong>`タグを使用してスタイル定義も

[code]

    .txt strong { font-weight: bold; }
    
[/code]

とするのが筋ではないでしょうか？

* * *

CSSクラス名に困る時点で、適切なスタイル・文書構造でない可能性があります。


CC BY-SA 3.0
2015-09-28T01:12:58.390
17013
2015-09-28T01:12:58.390
4236
17006
answer


特定のsectionだけマージンを変えたいということはそのsectionは他とは異なる意味を持つsectionということだと思います。  
それであれば同じクラス名を変えるかクラスを足してスタイルを変えればよいかと思います。

html

[code]

    <section class="section01 hoge"></section>
    
[/code]

css

[code]

    .section01.hoge {
      /* 他のsectionとは違うスタイルを設定 */
    }
    
[/code]

ページやコンポーネントによって微妙にスタイルが違う場合は上位のクラスを指定したセレクタで解決できないでしょうか。

[code]

    .txt {
      /* 共通のスタイル */
    }
    .page1 .txt {
      /* ページ1におけるスタイル */
    }
    .page2 .txt {
      /* ページ2におけるスタイル */
    }
    
[/code]


CC BY-SA 3.0
2015-10-01T05:20:47.917
17133
2015-10-01T05:20:47.917
3416
17006
answer