0

Twitter Bootstrap やその他のプロジェクトが、段落などの要素の既定のブラウザー マージンを上書きする正当な理由はありますか?

ブラウザのデフォルト (上下に 1em マージン):

p { margin: 1em 0; }

Twitter Bootstrap (下部のみ 10 ピクセルの余白):

p { margin: 0 0 10px; }

私の好み (上下に 10px の余白、または垂直のリズムの長さ):

p { margin: 10px 0; }

ここに私の考えがあります：

上下にマージンがあるので、要素間のマージンが大きくなりすぎないように、マージンの折りたたみに頼ることができます。他の要素から離れるべき要素はそうなるだろうと確信しています。

下部のみにマージンがある場合は、段落などをパディング付きのコンテナに配置するか、それらの上にある要素と同じ高さになるリスクを冒すか、その上にある可能性のあるものすべてにマージンボトムを適用して、デザインの間隔が空くようにする必要があります。

全体として、私はブラウザのデフォルトを好みます。足りないものはありますか？このトピックについて議論しているブログや記事はありますか?

4

2 に答える 2

4

このフィドルは、その理由を示す必要があります：http: //jsfiddle.net/men62/1/

それは、そのコンテナや他の要素に関連するテキストの一貫したレイアウトについてです。

于 2012-10-18T09:23:15.050 に答える
2

私自身も定かではありませんが、執筆規則と印刷デザインの両方で、この一連の規則に慣れているためだと思います。各段落には、その下部に余白が必要です。

少し前に受けた作文のクラスを思い出すと、各段落の下余白は新しい段落の開始を意味します。下マージンを適用できない場合は、インデントを新しい段落の目印として使用することもできます。ウィキペディアには、Robert Bringhurst の本The Elements of Typographic Styleに基づいて、これに関する説明があります。

Elements of Typographic Styleでは、最初の段落の後の段落をインデントするために「少なくとも 1 つの en [スペース]」を使用する必要があると述べており、それが「実用的な最小値」であることに注意してください。

...

他の技術も可能です。新しい段落の開始を示すために、行をアウトデントすることができます。もう 1 つの方法は、段落間に垂直方向のスペースを挿入することです。これにより、「ブロック段落」と呼ばれることもあるものが作成されます。

Microsoft Word などのワード プロセッサ ソフトウェアでは、デフォルトで、各段落の下部にスペース (通常は 10pt) が設定されています。Web に適用されると、ボトム マージン テクニックが優先されるようです。

Marco Dugonjicのブログ投稿は、「要素の行の高さに等しい下マージンを設定すると、正しい垂直リズムが保証される」ことを示唆しているようです。

于 2012-10-18T09:31:59.197 に答える