CSS スタイルの背景とテキストの詳細な紹介

高洛峰
リリース: 2017-03-09 10:38:12
オリジナル
1425 人が閲覧しました

1. 背景

1. 背景色には、background-color 属性を使用します。例: body{background-color:red}

2.画像、例: body{background-image:ul1(23.jpg)

3. 背景は、backgroud-repeat 属性を使用して画像によって繰り返しタイル化されます。これは、それぞれ水平または垂直のタイルを示します。

no-repeat は、どの方向からでも許可されることを示します

例: body

{background-image:url(23.jpg)
background-repeat:repeat-x:) }

4. 背景を使用します。 -position 属性で背景を配置します。[位置: 上、下、左、右、中央、

パーセント (50% 50%)、長さの値 (50px 50px) も使用できます]

例: body
{background-image:url(23.jpg)
background-position:center}

5.background-attachment を使用して画像の関連付け属性を設定します。たとえば、以下の画像の背景はスクロールしません。テキストのスクロール

body{background-image:url(23.jpg);

background-repeat: no-repeat;
background-attachment:fixed;}

2. テキスト

を使用します。テキストをインデントする text-indent 属性は、段落の最初の行のインデントです

例: p{text-indent:-5em} ですが、負の値を設定します。数値はブラウザ ウィンドウの左側の境界を簡単に超える可能性があるため、特に注意してください。

インデント値の単位はパーセント、長さの単位は px、測定単位は em です。

text-indent 属性は継承できます。例:

p#outer {width:500px;}
p#inter {text-indent:10%}
p{width:200px;}

2. 水平方向の配置はテキストを使用します。 -align 属性 (left、right、center、justice)

3. Word-spacing は単語 (単語) 間の標準の間隔を変更できます。デフォルト値の Normal は設定値 0 と同じですが、

word-spacing を受け入れます。正と負の両方の長さの値

4. Letter-spacing は文字間の間隔を変更します。その他は word-spacing と同じです。デフォルト値は 0 です。正の値と負の値が受け入れられます。長さの値

5. text-transform はテキストの大文字と小文字を処理します (なし、大文字、小文字、大文字、最初の文字は大文字です)

6. text-decoration はテキストの装飾 (なし、下線、上線)、行スルーを処理します。行、点滅フラッシュ

7、空白文字の処理 空白

値前行、空白文字: マージ、改行文字: 予約、自動行折り返し: 許可

値通常、空白文字: マージ、改行: 無視、ラップ: 許可

値 nowrap、空白: マージ、改行: 予約、ラップ: 許可されない

値の事前ラップ、空白: 予約、改行: 予約、ラップ: 許可

8ブロックレベル要素内のテキストの書き込み方向、リスト内のレイアウトの方向、テキストボックスを水平方向に埋めるコンテンツの方向、および両端揃え要素内の最終行の位置(値は ltr の 2 つあります)および rtk、ltr はデフォルト値であり、左から右への方向です)

9. Line-height は行の高さを設定します

上記の記事は、CSS スタイルの背景とテキストについて簡単に説明したものであり、共有されるすべての内容です。 by 編集者 お役に立てれば幸いです。皆様の参考になれば幸いです。PHP 中国語 Web サイトをぜひご利用ください。

以上がCSS スタイルの背景とテキストの詳細な紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
css
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!