ホームページ >ウェブフロントエンド >CSSチュートリアル >CSSでテキストを変更するにはどうすればよいですか?テキストスタイルを変更するための CSS の 9 つのプロパティ (概要)

CSSでテキストを変更するにはどうすればよいですか?テキストスタイルを変更するための CSS の 9 つのプロパティ (概要)

青灯夜游
青灯夜游オリジナル
2018-10-13 15:41:3712423ブラウズ

CSSでテキストを変更するにはどうすればよいですか?この記事では、CSS でテキストを変更するいくつかの方法を要約し、CSS で変更されたテキストのいくつかの属性を紹介し、CSS で変更されたテキストの 9 つの属性が何であるかを説明します。困っている友人は参考にしていただければ幸いです。

1. CSS 設定 文字色 属性

color 属性: 文字色を設定します。使用法は次のとおりです。

color:颜色值;

color 属性で設定できる正当なカラー値には、16 進数のカラー値 (例: #ffffff)、RGB カラー値 [例: rgb(0)] が含まれます。 ,0,0)]、rgba カラー値 [例: rgb(0,0,0,0.5)、0.5 は透明度を表します]、HSL カラー値 [例: hsl(120,65%,75%)]、HSL カラー値[hsl(120,65%,75%,0.3)、0.3 は透明度を表します]。

2. CSS テキストの行高さ (行間隔) 属性

line-height 属性: 行間の距離 (行の高さ) を設定します。使用方法は次のとおりです。

line-height:值;

css の line-height 属性は、テキストの行間隔を設定する方法です。以前の記事 [CSS で行間隔を設定する方法は?] を参照してください。 cssテキストの行間設定 text]ということで、皆さんの参考になれば幸いです。

3. CSS 設定 テキストの水平方向の配置 属性

text-align 属性: 要素内のテキストの水平方向の配置を設定します。使用法は次のとおりです。

text-align: left || right || center || justify ;

left: テキストを左揃えに設定します。デフォルト: ブラウザによって決定されます。

right: テキストを右揃えに設定します。

center: テキストを中央揃えに設定します。

justify: テキストを両端に揃える効果を実現します。

4. css Text indentAttribute

text-indent 属性: テキストのインデントを設定します。

具体的なcss text-indent属性テキストのインデントを設定する方法については、[CSSで最初の行のインデント効果を実現するにはどうすればよいですか?]を参照してください。 text-indent 属性は、最初の行 ] のインデントを実装します。

5. Text テキスト装飾の設定 Effect

text-decoration 属性: テキストに追加する装飾を定義します。

説明:

この属性を使用すると、テキストに下線などの特定の効果を設定できます。子孫要素に独自の装飾がない場合、祖先要素に設定された装飾は子孫要素にも「拡張」されます。

使用法:

text-indent:none ||  [underline(下划线) || overline(上划线) || line-through(中划线)] || blink ;

none: デフォルト値、標準テキストを定義します。

underline: テキストの下に線を定義します。

overline: テキスト上に線を定義します。

line-through: テキストの下を通る線を定義します。

blink: 点滅するテキストを定義します。

6, テキスト文字の大文字と小文字Transformation 属性

text-transform 属性: テキスト文字の大文字と小文字を制御します。

使用法:

text-transform:uppercase(全大写) || lowercase(全小写) || capitalize(首字母大写) || none ;

記事 [CSS で文字の大文字と小文字を設定するには?] を参照してください。 text-transform 属性は、文字の大文字化 ] を設定します。これについては詳しく説明します。

7, Text テキスト間隔 属性

word-spacing 属性: テキストまたは単語間の間隔を設定します。単語間の間隔 = 単語間隔のスペース サイズ。

Letter-spacing プロパティ: 文字間の間隔を設定します。

記事 [CSS でテキストの間隔を設定する方法?] を参照してください。 word-spacing属性とletter-spacing属性の簡単な比較]では、テキストの間隔を設定するword-spacing属性とletter-spacing属性のメソッドとその違いを紹介します。

8, テキスト シャドウの属性

text-shadow プロパティ: シャドウをテキストに設定します

テキスト シャドウ効果を実現する方法は、どなたでも読むことができます。記事 [CSS3 でテキストの影効果を追加するには? text-shadow はテキストのシャドウ効果を設定します ]詳細をご覧ください。

要約: 以上がこの記事の全内容です。皆さんの学習に役立つことを願っています。関連チュートリアルの詳細については、 CSS 基本ビデオ チュートリアル CSS3 ビデオ チュートリアル bootstrap チュートリアル をご覧ください。

以上がCSSでテキストを変更するにはどうすればよいですか?テキストスタイルを変更するための CSS の 9 つのプロパティ (概要)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。