一般的に使用される CSS 略語の構文概要_html/css_WEB-ITnose

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

カラー

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

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

ボックスのサイズ

には、通常、次の 4 つの記述方法があります:

property: value1; は、すべてのエッジが value1 であることを意味します。右側と左側の値は value2 プロパティ: value1 value2 value3; 上の値が value1、右側と左側の値が value2、下の値が value3 であることを意味します property:value1 value2 value3 value4;順番にtop、right、bottom、leftを表します

覚えておくと便利な方法は、時計回り、Up right、down leftです。 marginとpaddingの具体的な応用例は以下の通りです:

margin:1em 0 2em 0.5em;

border

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

border-width:1px; border-style:solid; :#000 ;

これは 1 つの文に省略できます: border:1px Solid #000;

構文は border:width style color; です。

背景 (背景)

背景のプロパティは次のとおりです。 : #f00; 背景-画像:url(背景 .gif); 背景-繰り返し: 固定; 背景-位置: 0 0; .background.gif) no-repeat fixed 0 0;

構文は、background:color imagerepeatattachmentposition;

1 つ以上の属性値を省略できます。省略した場合、属性値にはブラウザのデフォルト値が使用されます。デフォルト値は次のとおりです。

カラー: 透明 画像: なし 繰り返し: 繰り返し 添付ファイル: スクロール位置: 0% 0% フォント (フォント)

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

font-style:italic:small- caps; font-weight:bold; font-size:1em; line-height: 140%; 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; -style -image:url(image.gif);

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

と省略できます。