テキスト CSS スタイルには、テキストの色 "color"、テキストの方向 "direction"、文字間隔 "letter-spacing"、テキストの水平方向の配置 "text-align"、テキストの装飾 "text-decoration"、ヘッダー行が含まれます。インデント「text-indent」など
このチュートリアルの動作環境: Windows 7 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。
説明 | |
---|---|
テキストの色の設定 | |
テキストの方向を設定します。 | #letter-spacing |
line-height | |
text-align | |
text-decoration | |
text-indent | |
text-shadow | |
text-transform | |
unicode-bidi | |
#vertical-align | |
white-space | |
word-spacing | |
次はいくつかのCSSテキストスタイルを紹介します。 |
text-indent最初の行のインデント
最初の行のインデントは、段落の最初の行をインデントすることであり、一般的に使用されるテキストの書式設定効果です。一般的に中国語で文章を書く場合、これと同じように最初に空白が2つ入ります。 この属性の値は負の値にすることができます。
構文:
text-indent:<length> | <percentage> | inherit
tip: 初期値は 0;
適用対象: ブロック レベル要素 (ブロックおよびインライン ブロックを含む)
継承 : はい
パーセンテージ: 含まれるブロックの幅に対する相対値
ケース: 最初の文字の沈み込み
div { width: 200px; border: 1px solid black; text - indent: 0.5em; } div: first - letter { font - size: 30px; float: left; }
text-align 水平方向の配置
水平方向の配置は、要素内のテキストの水平方向の配置に影響します。 構文:
text-align: left | center | right | justify | inherit
初期値: left
適用対象: ブロックレベルの要素 (block および inline-block を含む)
継承: Yes
IE7 ブラウザの場合、text-align を使用すると、テキストの水平方向の配置が変更されるだけでなく、子孫のブロック レベル要素の水平方向の配置も変更されます
word -spacing word spacing
Word spacing は単語間隔を指し、テキストまたは単語間の間隔を設定するために使用されます。実際、「単語」は、ある種の空白文字で囲まれた空白文字以外の文字列を表します。 注: 単語はスペースで区切られます。単語間の間隔 = 単語間のスペース サイズ
注: 単語の間隔は負の値になる可能性があります
構文:
word-spacing: <length> | normal | inherit
初期値: 通常 (デフォルトは 0)
適用対象: すべての要素
継承: あり
letter-spacing 文字間隔
文字間隔は文字間隔を指します 注: 文字間隔は負の値になる可能性があります
letter-spacing:<length> | normal | inherit
初期値: 通常 (デフォルトは 0) )
適用対象: すべての要素
継承: has
text-transformText-transform
テキスト変換は、英語の大文字と小文字の変換を処理するために使用されます。 構文:
text-transform:uppercase(全大写) | lowercase(全小写) | capitalize(首字母大写) | none | inherit
初期値: none
適用対象: すべての要素
継承: はい
#text-decorationテキスト装飾テキスト装飾は、テキストに装飾線を提供するために使用されます。 注: テキスト変更行の色はテキストの色と同じです。
構文:text-decoration:none | [underline(下划线) || overline(上划线) || line-through(中划线)] | inherit
CSSビデオチュートリアル
)以上がテキストCSSスタイルとは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。