ホームページ > 記事 > ウェブフロントエンド > CSSのtext-align属性の使い方
CSSのtext-align属性の使い方
- 青灯夜游オリジナル
- 2019-05-28 09:30:294793ブラウズ
css text-align プロパティは、要素内のテキストの水平方向の配置を設定するために使用されます。このプロパティは、ライン ボックスが整列する位置を指定することによって、ブロック レベル要素内のテキストの水平方向の整列を設定します。値 justify は、ユーザー エージェントが行コンテンツ内の文字と単語の間の間隔を調整できるようにすることでサポートされており、ユーザー エージェントによって異なる結果が得られる場合があります。
#css text-align 属性を使用するにはどうすればよいですか?
text-align 属性は、要素内のテキストの水平方向の配置を指定します。構文:
text-align : left | right | center | justify | inherit;
属性値:
● Left: テキストを左に配置します。デフォルト: ブラウザによって決定されます。 # 右: テキストを右に配置します。##●center: テキストを中央に配置します。
##●両端揃え: テキストを両端に揃える効果を実現します。## ● Inherit: text-align 属性の値を親要素から継承することを指定します。
説明:この属性は、行ボックスが整列する点を指定することによって、ブロックレベル要素内のテキストの水平方向の整列を設定します。値 justify は、ユーザー エージェントが行コンテンツ内の文字と単語の間の間隔を調整できるようにすることでサポートされており、ユーザー エージェントによって異なる結果が得られる場合があります。
注: すべてのブラウザは text-align 属性をサポートしています。属性値「inherit」は、Internet Explorer (IE8 を含む) のどのバージョンでもサポートされていません。
css text-align 属性の例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
.box{
width: 400px;
height: 200px;
border: 1px solid red;
}
h1 {
text-align: center
}
h2 {
text-align: left
}
h3 {
text-align: right
}
</style>
</head>
<body>
<div class="box">
<h1>这是标题 1</h1>
<h2>这是标题 2</h2>
<h3>这是标题 3</h3>
</div>
</body>
</html>レンダリング:
以上がCSSのtext-align属性の使い方の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。