程序员人生网站导航

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

栏目：htmlcss时间：2014-05-08 09:23:55

本篇文章适合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:10ox;

　　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;

　　}

------分隔线----------------------------

上一篇 ajax实例教程：模拟google动态提示效果

下一篇 Access数据库提示OleDbException (0x80004005): 操作必须使用一个可

------分隔线----------------------------