CSSノート(美化テキスト)

一、フォントスタイル1、フォントタイプを定義する(以下の"|"はオプション値を区切るために使用される)1)font-family属性font-family: 1 ， 2 ， 3 はフォント名で定義され、優先順位で並べられ、カンマ区切りfont-family:ncursive|fantasy|monospace|serif|sans-serifフォントシーケンス名で定義2)font属性(複数のフォント属性を定義できる複合属性)font:font-style| |font-variant| |font-weight| |font-size| |line-height| |font-family(属性間はスペースで区切られています.fontは少なくともフォントサイズとタイプを設定し、後ろに置く必要があります.そうしないと無効です)font:caption|icon|menu|message-box|small-caption|status-bar CSSには5種類の汎用フォントがあります.serif:ライニングフォント、通常は広くなり、太さは明らかにsans-serif:ライニングフォントがなく、通常は広くなり、太さは明らかではありませんcursive:草、斜字形、連筆またはその他の草体特徴fantasy:奇異フォント、芸術字monospace:等幅フォント
2、フォントサイズfont-size:xx-small | x-small | small | small | medium | large | x-large | xx-large | larger | smaller | length largerとsmallerは親のフォントに応じて調整し、em単位でlengthのパーセンテージを計算して親のフォントで計算し、em単位で計算するのと同じである.
3、フォント色color : color 3色表示:色名color:gray十六進法color:#666666 RGB color:rgb(120,120,120) CSS 3がサポートする他の3色表示RGBA:RGBにAlphaチャネルを追加し、半透明色HSLを定義できる:色相(H)、彩度(S)、明るさ(L)color:hsl(0,100%,100%) HSLAを使用する:HSLにAlphaチャネルを追加し、半透明色を定義できる
4、フォントの太さfont-weight:normal | bold | bolder | lighter | 100 | 200 | 300 |400 | 500 | 600 | 700 | 800 | 900属性の値を取り、normalはデフォルト値を表し、値400に相当し、boldは700に相当する.
5、斜体フォントfont-style: normal | italic | oblique italicとobliqueは斜体
6、下線text-decoration: none| |underline| |blink| |overline| |line-through overlineは上線、line-throughは貫通線を示す.・
7、フォントの大文字と小文字font-variant:normal | small-capsとtext-transform:none|capitalize|uppercase|lowercase二、テキストスタイル1、テキスト揃えtext-align : left |right|center|justify leftデフォルト値、左揃え;right右揃え;センター中央揃え;justify両端揃え2、垂直揃えvertical-aligh: auto | baseline | sub | super | top | text-top | middle | bottom | text-bottom | length autoはlayout-flow属性の値に基づいてbaselineデフォルト値を揃えます.valignプロパティをサポートするオブジェクトの内容をベースラインに整列sub垂直整列テキストを表す下付きsuper垂直整列テキストを表す上付きtopは、valignプロパティをサポートするオブジェクトのテキストとオブジェクトの先端を整列middleは、valignプロパティをサポートするオブジェクトの内容とオブジェクトの中央を整列bottomは、valignプロパティをサポートするオブジェクトの内容とオブジェクトの下端を整列text-bottomは、valignプロパティをサポートするオブジェクトのテキストとオブジェクトの下端の位置合わせlengthは、ベースラインから算出されるオフセット量3、ピッチおよびピッチletter-spacingピッチ(アルファベットピッチ、中国語有効)word-spacingピッチ(単語ピッチ、中国語無効)4、行高(行ピッチ)line-height: normal | length 5、インデントtext-indent: 2emを表す
CSS 3にテキストスタイル1、テキストシャドウtext-shadow: none | length1 length2 length3 color length 1を追加:シャドウ水平オフセットlength 2:シャドウ垂直オフセットlength 3:シャドウ垂直オフセットlength 3:ファジイ値2、シャドウ特効テキストシャドウの適用:コントラストの増加、多色シャドウの定義、炎文字の定義、立体文字の定義、線フォントの定義など.3、定義オーバーフローテキストtext-overflow: clip|ellipsis|ellipsis-word clipは省略タグを表示せず、残りは省略タグを表示し、ellipsis挿入位置は最後の文字、ellipsis-word挿入位置は最後の語4、テキスト改行(略)5、動的コンテンツ追加content: normal|string|attr()|uri()|counter()|none normal:デフォルトstring:テキストコンテンツ挿入sttr()挿入要素の属性値url()挿入外部リソースcounter()挿入:カウンタ、ソートID noneを挿入するには、何もありません6、デフォルトスタイルCSS 3を復元するinitial属性値を追加し、ある要素のスタイル指定を直接取り消すことができます7、カスタムフォントタイプ@font-face{ }のプロパティと値の説明は、font-family:テキストのフォント名font-styleを設定する:テキストスタイルfont-variantを設定する:テキストの大文字と小文字を設定するfont-weight:テキストの太さを設定するfont-stretch:テキストが横方向に伸びるかどうかを設定するfont-size:テキストフォントサイズsrcを設定する:カスタムフォントの絶対パスまたは相対パスを設定する.