文字を中央揃えや、左寄せ、右寄せにするには、プロパティにtext-alignを指定します。
text-align:位置の指定;
}
text-align:の後に、center(中央揃え)、right(右寄せ)、left(左寄せ)のいずれかを指定します。
例えば文字を中央揃えに指定した場合、以下のように表示されます。
文字の中央揃えサンプル
それぞれの指定方法
[中央寄せにする場合]text-align:center;
}
text-align:left;
}
【右寄せにする場合】
text-align:right;
}
<!DOCTYPE HTML>
<html lang="ja">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="style.css">
<title>文字寄せのサンプル</title>
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<p class="text">テキストテキスト</p>
</body>
</html>
表示サンプル
[中央寄せ]テキストテキスト
テキストテキスト
テキストテキスト
覚えておきたいポイント
文字の体裁を整えるのに便利
基本的にはWordなどの文字寄せ機能と一緒と考えてもらってOKです。文書の体裁を整える場合や、注目させたい文字などに利用すると効果的です。