去掉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
投稿

猜你喜欢

  • Python matplotlib以日期为x轴作图代码实例

    2021-08-17 03:41:09
  • 基于opencv的selenium滑动验证码的实现

    2023-06-20 20:14:26
  • 从网页设计开始

    2008-06-30 12:17:00
  • SQLSERVER数据库升级脚本图文步骤

    2024-01-27 10:20:26
  • Django+python服务器部署与环境部署教程详解

    2023-01-29 15:16:22
  • Python3enumrate和range对比及示例详解

    2021-02-05 02:11:47
  • python爬虫获取京东手机图片的图文教程

    2023-12-24 08:29:21
  • python中requests模块的使用方法

    2021-12-27 23:16:29
  • python语音识别指南终极版(有这一篇足矣)

    2021-09-15 23:57:21
  • python基础知识之字典(Dict)

    2023-08-25 20:01:44
  • Python中的CURL PycURL使用例子

    2023-05-13 04:14:31
  • eBay 打造基于 Apache Druid 的大数据实时监控系统

    2022-12-25 21:54:37
  • JS图片根据鼠标滚动延时加载的实例代码

    2024-04-22 13:22:33
  • 一文了解MySQL事务隔离级别

    2024-01-24 11:23:02
  • Python深度学习TensorFlow神经网络基础概括

    2022-08-13 02:57:18
  • Python 树表查找(二叉排序树、平衡二叉树)

    2021-01-27 03:06:20
  • VSCode插件安装完成后的配置详解

    2022-02-16 00:36:34
  • pytorch MSELoss计算平均的实现方法

    2021-07-31 18:44:15
  • CentOS 6.4安装配置LAMP服务器(Apache+PHP5+MySQL)

    2023-11-21 21:42:33
  • 数据库主键的故事

    2008-05-31 07:50:00
  • asp之家 网络编程 m.aspxhome.com