• 指間主站
• 空間域名
• 企業郵局
• 在線商城
• 幫助中心
• 支付方式
• 收藏本站

• 域名注冊
• 網站建設
• 虛擬主機
• 企業郵局
• 智能建站
• 平面設計
• 多媒體制作
• 改版維護
• 網站推廣
• 程序開發
• 電腦維修

• ·聯系電話:+86.023-75585550
• ·聯系傳真:+86.023-75585550
• ·24小時手機:13896886023
• ·QQ 咨 詢：361652718 513960520

為大家介紹簡單的CSS優化。
涉及優化內容：
1、CSS代碼優化
2、CSS重用優化

一、CSS代碼優化地方：
1、border(CSS邊框)簡寫：
border-top:1px solid #000;border-bottom:1px solid #000;border-left:1px solid #000;border-right:1px solid #000;
可以簡寫為：border:1px solid #000;

2、padding（CSS padding）簡寫：
padding-top:1px;padding-right:2px;padding-bottom:3px;padding-left:4px;
可簡寫為：padding:1px 2px 3px 4px;
padding-top:1px;padding-right:1px;padding-bottom:1px;padding-left:1px;
可簡寫為：padding:1px;

3、margin簡寫
margin-top:1px;margin-right:2px;margin-bottom:3px;margin-left:4px;
可簡寫為：margin:1px 2px 3px 4px;
margin-top:1px;margin-right:1px;margin-bottom:1px;margin-left:1px;
可簡寫為：margin:1px;

4、background簡寫
background-color:#000;可以簡寫為background:#000;
background-image:url(圖片地址)
可簡寫為：background:url(圖片地址)

5、font簡寫
font-size:12px; line-height:12px; font-family:Arial, Helvetica, sans-serif;
可簡寫為：font:12px/12px Arial, Helvetica, sans-serif;

二、CSS重用優化
這里主要介紹是CSS代碼的共用屬性提取來達到節約代碼、維護方便，CSS實例如下：
.webjxcom_a{ width:100px; height:20px; text-align:left; float:left; font-size:24px;}
.webjxcom_b{ width:100px; height:20px; text-align:right; float:left; font-size:24px;}
他們都有相同高度、寬度、浮動、文字大小，而只有內容居左居右不同(你可能需要了解CSS居中)，我們就可以提取他們相同屬性
優化后:
.webjxcom_a ,.webjxcom_b{ width:100px; height:20px; text-align:left; float:left; font-size:24px;}
.webjxcom_b{text-align:right; }