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

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

本篇文章适合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; }

标签:代码,精简,优化,css
0
投稿

猜你喜欢

  • 链接与文本标签们

    2008-04-04 18:07:00
  • OverFlow:一个秘密武器

    2011-02-26 15:41:00
  • T-SQL问题解决集锦 数据加解密全集

    2012-07-11 15:34:08
  • 转换字符串单词的第一个字母为大写

    2007-10-18 10:50:00
  • LZ77 算法的JS实现

    2010-04-11 22:32:00
  • 全新极速CSS选择器引擎whiz

    2009-08-30 15:48:00
  • ASP技巧:ASP中三个常用语句的使用技巧

    2008-10-16 10:56:00
  • MySQL数据库本地备份和双机相互备份

    2008-05-27 12:25:00
  • 为导入文件加上时间戳标记的两种方法

    2009-01-07 14:14:00
  • 用正则替换所有URL

    2009-03-13 13:51:00
  • 30步检查SQL Server安全列表

    2008-12-18 14:28:00
  • aspjpeg 半透明描边的实现函数

    2008-12-17 12:02:00
  • 网页设计中的层次感

    2007-11-05 18:19:00
  • 巧用Dreamweaver MX制作阴影字

    2009-08-31 17:36:00
  • (X)HTML Strict 下的嵌套规则

    2008-03-08 18:39:00
  • 淘宝搜索框研究报告

    2010-07-27 12:49:00
  • 一个图片后加载的代码

    2008-09-28 13:03:00
  • SQL Server数据库备份多种方法

    2008-11-24 15:27:00
  • ASP中查询数据库记录写入XML文件示例

    2007-08-23 13:12:00
  • js 混淆加密工具代码

    2007-09-22 18:10:00
  • asp之家 网络编程 m.aspxhome.com