1. ボックスモデルのコードの略称
ボックスモデルを語るとき、上下左右の4方向にマージン(margin)、パディング(padding)、ボーダー(border)が設定されていることを覚えておいてください。時計回りに設定します:右上、左下。マージンとパディングの具体的な適用例は次のとおりです。
1 |
|
には通常、次の 3 つの省略方法があります。
1. のように、top、right、bottom、および left の値が同じ場合。次のコード:
1 |
|
は、次のように短縮できます:
1 |
|
2. 次のコードのように、top とbottom の値が同じで、left と right の値が同じ場合:
1 |
|
は次のように省略できます:
1 |
|
3. 次のコードのように、左と右の値が同じ場合:
1 |
|
は次のように省略できます:
1 |
|
注:パディングとボーダーの省略方法はマージンと同じです。
2. カラー値の省略
設定したカラーが16進数のカラー値の場合、それぞれの2桁の値が同じであれば、その半分を省略することもできます。
例 1:
1 2 3 4 5 6 7 |
|
3. フォントの省略形
Web ページのフォント CSS スタイル コードにも、独自の省略形メソッドがあります。以下は、Web ページのフォントを設定するためのコードです。コードは実際には 1 つの文に短縮できます:
1 |
|
1. この短縮形を使用するには、少なくとも font-size 属性と font-family 属性、およびその他の属性 (font-weight、 font-style、font-varient、line-height) 指定しない場合は、デフォルト値が自動的に使用されます。
2. 省略する場合は、font-sizeとline-heightの間に「/」を斜めに追加します。
一般に、中国語の Web サイトには英語が比較的少ないため、次の略語コードがより一般的に使用されます:
1 |
|
フォント サイズ、行間隔、中国語フォント、および英語フォントの設定があるだけです。
上記は [CSS Note 8] CSS コードの省略形であり、より少ない帯域幅を使用します。関連コンテンツについては、PHP 中国語 Web サイト (www.php.cn) に注目してください。