网络编程
位置:首页>> 网络编程>> 网页设计>> 去掉CSS赘余代码,CSS可以更简洁

去掉CSS赘余代码,CSS可以更简洁

  发布时间:2008-11-05 13:07:00 

标签:代码,精简,优化,css

本篇文章适合css新手学习,对于已经掌握了css的朋友们也可以通过本片文章来复习知识。

作者通过实践,认为在有些情况下css的代码是可以更加简洁的,多数情况下是因为新手对于一些具有多属性的元素代码不能精简来写造成的。

精简的代码对于网页是有莫大的好处的,对于浏览者访问速度会有一定的提升,另外对于搜索引擎也更加可以抓取网页关键内容。废话不说了,下面就看看笔者总结的可以精简的代码:


1.Margin & Padding

例1:



.div {
margin-top:10px;
margin-right: 5px;
margin-bottom:30px;
margin-left:0px;
}

精简后代码如下:


.div { margin:10px 5px 30px 0;})

例2:



.div {
margin-top:10px;
margin-right:20px;
margin-bottom:0;
margin-left:20px;
}

精简后代码:



.div {
margin:10px 20px 0;
}

例3:



.div {
margin-top:0;
margin-right:auto;
margin-bottom:0;
margin-left:auto;
}

精简后代码:



.div {
margin:0 auto;
}

例4:



.div {
margin-top:50px;
margin-right:50px;
margin-bottom:50px;
margin-left:50px;
}

精简后代码:



.div { margin:50px; }

0
投稿

猜你喜欢

手机版 网络编程 asp之家 www.aspxhome.com