9月 2016 - うぇぶのきわみ

CSSの場合 テキスト要素は .css{ text-align: center; } テキスト ではテキストがボックスの中央に配置される。この場合、画面に対してブロック要素は中央寄せされない。 画面に対して中央寄せしたい場合は、div要素をブロック要素にする。 .css{ display: block; } これに加えて左右のマージンを追加する。 .css{ display: block; margin-left: auto; margin-right: auto; } bootstrap3の場合 テキスト要素は class="text-center" ブロック要素の場合は class="center-block" を指定するだけでtext-align: center;が適用される。 class="center-block"を指定することで、以下のCSSが適用される。 .center-block{ display: block; margin-left: auto; margin-right: auto; } 右寄せする方法 テキスト要素は .css{ text-align: right; } テキスト ではテキストがボックスの右寄せに配置される。この場合、画面に対してブロック要素は右寄せされない。 画面に対して右寄せしたい場合は、div要素をブロック要素にする。 .css{ display: block; } これに加えて幅(width: )と左のマージン（margin-left: auto）を追加する。 .css{ display: block; margin-left: auto; width: 100px; }

うぇぶのきわみ

月別: 2016年9月

CSS、bootstrapでのテキスト、ブロック要素の中央寄せの方法まとめ