一般的な CSS 省略構文の概要

一般的に使用される CSS 略語構文の概要

略語を使用すると、CSS ファイルのサイズが小さくなり、読みやすくなります。 CSS 省略形の主な規則は次のとおりです。

カラー

16 進数のカラー値が同じ場合は、半分に省略できます。たとえば、

#000000 は #000 に省略でき、#336699 は省略できます。 to #369 ;

ボックスのサイズ

通常は4つの書き方があります:

PROperty: value1; はすべての辺が値であることを意味します;

property: value1 value2; は上と下が値であることを意味しますvalue1、右と左の値はvalue2です

property:value1 value2 value3; 上の値はvalue1、右と左の値はvalue2、下の値はvalue3です

property:value1 value2 value3 value4; 4 つの値は順に上、右、下を表します。 ,left

時計回り、右上、左下と覚えておくと便利です。 marginとpaddingの具体的な応用例は以下の通りです:

Margin:1em 0 2em 0.5em;

Border(ボーダー)

ボーダーのプロパティは以下の通りです:

border-width:1px;

border -style:solid;

border-color:#000;

一文に省略できます: border:1px Solid #000;

構文は border:width style color;

Backgrounds

のプロパティです。背景は次のとおりです:

background-color:#f00;

background-image:url(background.gif);

background-repeat:no-repeat;

background-attachment:fixed;

background-position :0 0;

一文に短縮可能 ：background:#f00 url(background.gif) no-repeat fixed 0 0;

構文はbackground:color imagerepeatattachmentposition;です

どちらか一方を省略してもよいし、省略した場合、属性値はブラウザのデフォルト値を使用します。デフォルト値は次のとおりです:

color:transparent

image:none

repeat:repeat

attachment:scroll

position:0% 0%

フォント(フォント)

フォントのプロパティは次のとおりです：

font-style:italic;

font-variant:small-caps;

font-weight:bold;

font-size :1em;

line-height:140%;

font-family: "Lucida Grande",sans-serif;

一文に短縮できます: font:italic small-caps 太字 1em/140% "Lucida Grande ",sans-serif;

フォント定義を省略する場合は、少なくとも font -size と font-family の 2 つの値を定義してください。

リスト

デフォルトのドットとシリアル番号をキャンセルするには、list-style:none;,

listの属性は次のとおりです:

list-style-type:square;

list-style- Position: inside;

list-style-image:url(image.gif);

一文に短縮できます: list-style:square inside url(image.gif);

上記は、一般的に使用される CSS 省略構文など その他の関連記事については、PHP 中国語 Web サイト (www.php.cn) に注目してください。