网站源代码之CSS缩写

2013/1/27 8:49:00 人评论次

DIVCSS缩写——CSS缩写顾名思义缩写有简写意思，这节我们介绍CSS缩写知识点，并附带常见CSS缩写范例。为什么要让CSS属性缩写？CSS代码缩写的好处有哪些呢？1、简化代码。一些CSS属性简写可以减少CSS代码从而减少CSS文件的占用字节，加快网页下载速度和网页加...

DIV CSS缩写——CSS 缩写顾名思义缩写有简写意思，这节我们介绍CSS缩写知识点，并附带常见CSS缩写范例。

为什么要让CSS属性缩写？CSS 代码缩写的好处有哪些呢？
1、简化代码。一些CSS属性简写可以减少CSS代码从而减少CSS文件的占用字节，加快网页下载速度和网页加载打开速度。
2、优化CSS目的。其中CSS优化之一即是简化代码缩写CSS属性代码。

常见DIV+CSS缩写属性：
1、CSS 文本：font-size:12px; font-weight:bold; font-family:Arial, Helvetica, sans-serif; line-height:22px;即可简写缩写为font:12px/22px bold Arial, Helvetica, sans-serif;
2、CSS 背景：background-color:#F00;background-image:url(图片地址);background-position:bottom;background-repeat:no-repeat; 即可将背景CSS属性缩写为：background:#F00 url(图片地址) no-repeat left bottom;

3、CSS 内补距（CSS padding）:padding-top:5px; padding-bottom:10px; padding-left:15px; padding-right:20px; 即可缩写为padding:5px 20px 10px 15px; 或padding-top:5px; padding-bottom:5px; padding-left:10px; padding-right:10px;缩写为padding:5px 10px;
4、CSS 外边距（CSS margin）:margin-top:5px; margin-bottom:10px; margin-left:15px; margin-right:20px;即可缩写为margin:5px 20px 10px 15px; 或margin-top:5px; margin-bottom:5px; margin-left:10px; margin-right:10px;缩写为margin:5px 10px;
5、CSS 边框：border-left:1px solid #000;border-right:1px solid #000;border-top:1px solid #000;border-bottom:1px solid #000;即可缩写为：border:1px solid #000;

上一篇：企业如何提高内网服务器安全

下一篇：HTTP 错误 403.1 - 禁止访问：执行访问被拒绝。故障案例