略語を使用すると、CSS ファイルのサイズが小さくなり、読みやすくなります。 CSS の略語の主なルールは次のとおりです:
カラー
16 進数のカラー値は、各 2 桁の値が同じ場合、たとえば次のように半分に短縮できます。
#000000 は #000 に短縮でき、#336699 は #369 に短縮できます。
ボックスサイズ
通常、次の 4 つの書き方があります:
- property:value1; すべてのエッジの値が value1 であることを意味します。
- property:value1 value2; 上下の値が value1、左右の値が value2 であることを意味します。
- property:value1 value2 value3; 上の値が value1、右と左の値が value2、下の値が value3 であることを意味します
- property:value1 value2 value3 value4; 4 つの値は順に上、右、下、左を表します
時計回り、右上、左下と覚えておくと便利です。マージンとパディングの具体的な適用例は次のとおりです。
margin:1em 0 2em 0.5em;
ボーダー(枠線)
境界線のプロパティは次のとおりです:
ボーダー幅:1px;
- ボーダースタイル:ソリッド;
- ボーダーカラー:#000;
-
は次の 1 つの文に短縮できます: border:1px Solid #000;
構文は
border:width style color;
です。
背景
背景のプロパティは次のとおりです:
背景色:#f00;
背景画像:url(background.gif);
- 背景リピート:リピートなし;
- 背景添付:修正済み;
- 背景位置:0 0
-
-
は、次の 1 つの文に短縮できます。background:#f00 url(background.gif) no-repeat fixed 0 0;
構文は
background:color imagerepeatattachmentposition;
です。
1 つ以上の属性値を省略できます。省略した場合、属性値にはブラウザのデフォルト値が使用されます。
色: 透明
画像: なし
リピート: リピート
- 添付ファイル: スクロール
- 順位: 0% 0%
-
-
- フォント
フォントの属性は次のとおりです:
フォントスタイル:斜体;
font-variant:small-caps;
フォントの太さ:太字;
- フォントサイズ:1em;
- 行の高さ:140%;
- フォントファミリー:"Lucida Grande"、サンセリフ
-
-
- は 1 つの文に省略できます: font:italic small-caps ball 1em/140% "Lucida Grande",sans-serif;
フォント定義を省略する場合は、少なくとも 2 つの値 (font-size と font-family) を定義する必要があることに注意してください。
リスト
デフォルトのドットとシリアル番号をキャンセルするには、list-style:none;,
と記述します。
リストの属性は次のとおりです:
リストスタイルタイプ: 正方形;
リストスタイル位置:内側;
リストスタイルイメージ:url(image.gif); -
-
- は、list-style:square inside url(image.gif);
という 1 つの文に短縮できます。