DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> CSS入門知識 >> DIV十CSS布局 >> 布局實例 >> CSS中常用的縮寫方式
CSS中常用的縮寫方式
編輯:布局實例     

  使用縮寫可以幫助減少你CSS文件的大小,更加容易閱讀。css縮寫的主要規則如下:

  顏色

  16進制的色彩值,如果每兩位的值相同,可以縮寫一半,例如:#000000可以縮寫為#000;#336699可以縮寫為#369; #f2f2f2是不可以縮寫的

  盒模型的邊框

  border-width:1px;

  border-style:solid;

  border-color:#000;

  可以縮寫為一句:

  border:1px solid #000;

  語法是border:width style color;

  盒模型的邊界和填充

  margin-top:1px; margin-right:2px; margin-bottom:3px; margin-left:4px;

  margin:1px 2px 3px 4px;

  注意:這裡的順序是順時針,分別為:上右下左

  margin:1px 2px;

  margin:0;

  注意:CSS中值為0時可以不帶單位,其它時候都必須帶單位

  背景

  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;

  字體

  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 bold 1em/140% "Lucida Grande",sans-serif;

  注意,如果你縮寫字體定義,至少要定義font-size和font-family兩個值。

  列表

  list-style-type:square;

  list-style-position:inside;

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

  可以縮寫為一句:

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

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved