text-align - テキストの左寄せ、中央寄せ、右寄せ - CSS入門【CSS3対応】
テキストを左寄せ、中央寄せ、右寄せにするにはtext-alignをスタイルシート(CSS)に設定します。
左寄せ
中央寄せ
右寄せ
<div style="text-align:left;background:#eef;"> 左寄せ </div> <br> <div style="text-align:center;background:#eef;"> 中央寄せ </div> <br> <div style="text-align:right;background:#eef;"> 右寄せ </div>
要素の左寄せ、中央寄せ、右寄せ
要素が、インライン要素、インラインブロック要素であれば、text-alignで左寄せ、中央寄せ、右寄せができます。
インライン要素 - imgタグ
インライン要素であるimgタグは、text-alignで左寄せ、中央寄せ、右寄せができます。
<div style="text-align:center;background:#eef;"> <img src="/images/webdesign-logo.png"> </div>
インラインブロック要素 - buttonタグ
インラインブロック要素であるbuttonタグは、text-alignで左寄せ、中央寄せ、右寄せができます。
<div style="text-align:center;background:#eef;"> <button>ボタン</button> </div>