一、CSS代碼縮寫，佔用更少的帶寬
1.1、顏色值縮寫
關於顏色的css樣式是可以縮寫的，當你設置的顏色是16進制的色彩值時，如果每兩位的值相同，可以縮寫一半。
例子1：p{color:#000000;}
可以縮寫爲：p{color: #000;}
例子2：p{color: #336699;}
可以縮寫爲：p{color: #369;}
1.2、字體縮寫
網頁中的字體 css 樣式代碼也有他自己的縮寫方式，下面是給網頁設置字體的代碼：
body{
font-style:italic;
font-variant:small-caps;
font-weight:bold;
font-size:12px;
line-height:1.5em;
font-family:"宋體",sans-serif;
}
這麼多行的代碼其實可以縮寫爲一句：
body{
font:italic small-caps bold 12px/1.5em "宋體",sans-serif;
}
注意：
1、 使用這一簡寫方式你至少要指定 font-size 和 font-family 屬性，其他的屬性 (如 font-weight、font-style、font-variant、line-height) 如未指定將自動使用默認值。
2、 在縮寫時 font-size 與 line-height 中間要加入**“/”斜扛**。
一般情況下因爲對於中文網站。
二、單位和值
2.1、顏色值
在網頁中的 顏色 設置是非常重要，有 字體顏色（color）、背景顏色（background-color）、邊框顏色（border） 等，設置顏色的方法也有很多種：
1、英文命令顏色：p{color:red;}
2、RGB顏色：p{color:rgb(133,45,200);}
3、十六進制顏色：p{color:#00ffff;}
2.2、長度值
長度單位總結一下，目前比較常用到px（像素）、em、% 百分比，要注意其實這三種單位都是相對單位。
1、像素
像素爲什麼是相對單位呢？因爲像素指的是顯示器上的小點（CSS 規範中假設 “90像素=1英寸”）。實際情況是瀏覽器會使用顯示器的實際像素值有關，在目前大多數的設計者都傾向於使用**像素（px）**作爲單位。
2、em
就是本元素給定字體的 font-size 值，如果元素的 font-size 爲 14px ，那麼 1em = 14px； 如果 font-size 爲 18px，那麼 1em = 18px。 如下代碼：p{font-size:12px;text-indent:2em;}
上面代碼就是可以實現段落首行縮進 24px（也就是兩個字體大小的距離）。
3、百分比
設置行高（行間距）爲字體的130%（12 * 1.3 = 15.6px）。
p{font-size:12px;line-height:130%}
此篇博客代碼下載地址：CSS教程代碼下載
博主的所有博客目錄如下：博客文章目錄彙總
Java面試部分的博客目錄如下：Java筆試面試目錄
轉載請標明出處，原文地址：https://blog.csdn.net/weixin_41835916 如果覺得本文對您有幫助，請點擊頂支持一下，您的支持是我寫作最大的動力，謝謝。
