[CSS]補習の研究ノート(フォントスタイル属性)追加の記事

CSSフォントスタイル属性

 

ディレクトリ

CSSフォントスタイル属性

A、フォント属性

二、色属性

三、行の高さの行間(行の高さ)

四、テキスト整列水平配向

五、最初の行のインデントテキストのインデント

第六に、装飾的なテキストの装飾のテキスト


 

A、フォント属性


フォントは、包括的なセットのフォントスタイルに属性。
基本的な構文:
セレクタ{フォント:フォントスタイルfont-重量フォントサイズ/行の高さフォントファミリー;}
フォントの合字が順序付けられ、順序を交換することができない、スペース各属性によって分離。
フォントサイズ、およびフォントファミリは、(省略可能)を省略することができない、または仕事はしていません。

[サンプルコード]
    <スタイル>
        のH1 {
            フォント:12ピクセル"微軟雅黒";
        }
    </スタイル>

 

二、色属性


色は、本実施形態は、次の3つの値を持つテキストの色を定義します。

  • 図1に示すように、例えば、赤、緑、青などの所定の色の値。
  • 開始2進数の「#」など#FF0000(または#F00)同じ、次いで二十から二は略すことがある(3つの毎に2つのグループは同じでなければならない)場合、#FF6600(または#F60)、等#29D794、。
  • 3、赤などRGBコードは、RGB(255,0,0)またはRGB(100%、0%、0%)として表すことができます。

[サンプルコード]

    <スタイル>
        スパン{
            色:#FF0000;
        }
    </スタイル>

 

三、行の高さの行間(行の高さ)


行の高さ属性は、行間隔を設定するために使用される一般的行の高さとして知られている、行と行の間の距離です。
画素PXに共通のプロパティ値、%でEMとの相対値で、最も一般的な方法は同様であるピクセルのピクセル
一般に、フォントサイズより7/8程度の画素に対して大きな間隔。

[サンプルコード]
    <スタイル>
        P {
            フォントサイズ:16pxに、
            行の高さ:は24px;
        }
    </スタイル>


四、テキスト整列水平配向


レベルテキスト-alignプロパティは、整列は、HTML属性を揃えることに関して整列されたテキストを設定するために使用されます。

  • 左:左(デフォルト)
  • 右:右揃え
  • センター:揃え

[サンプルコード]
    <スタイル>
        H1 {
            フォント:12ピクセル"微軟雅黒";
            テキスト整列=左:センター; / *レッツH1はテキスト内側中心* /
        }
    </スタイル>


五、最初の行のインデントテキストのインデント


属性は、数値属性値が異なる単位、全角文字幅やブラウザウィンドウの%の幅に対する割合の倍数とすることができるテキストインデントインデントテキストを設定するために使用され、負の値の使用は一般により推奨されている可能EM
1EMは1EMが1に等しいワード、パラグラフ通常の文字、文字の幅です。

[サンプルコード]

    <スタイル>
        P {
            フォントサイズ:16pxに、
            行の高さ:は24px;
            テキストインデント:2EM; / *段落インデント第1のワード線* /
        }
    </スタイル>

 

第六に、装飾的なテキストの装飾のテキスト


テキストの装飾は、一般的に、リンク装飾効果を変更するために使用されます。

  • なし飾り気のない(デフォルト) - 装飾キャンセル使用して
  • 下線下線 - 共通
  • 点滅点滅
  • 上線上線
  • ライン貫通線(取り消し線)

[サンプルコード]

    <スタイル>
        のdiv {
            フォントサイズ:40ピクセル;
            テキスト装飾:下線;
        }
    </スタイル>

[ニーモニック概要]

  1. 傾き:EMタグと私はキャンセルフォントスタイルを傾け→:正常;傾斜のフォントスタイルを追加します。イタリック。
  2. 太字:強いタグとB→太字量をキャンセル:正常;フォント重量:400;太字量を添加する:太字;フォント重量:700。
  3. 下線:U→ラベルのインと下線テキストの装飾オフ:なし;下線テキスト装飾:下線;
  4. 取り消し線:S→と元に戻すデルタグラインテキスト装飾:なし;取り消し線テキストの装飾:ライン・スルー。

 

リリース2018元の記事 ウォンの賞賛3957 ビュー1035万+

おすすめ

転載: blog.csdn.net/zhongguomao/article/details/104600545