在网页开发中,html的元素,有部分元素默认是有内外边距的,例如body 元素,是有默认边距的

所以在通常情况下,我们都要先清空元素的内外边距:使用通配符选择器* 清空元素的内边距和外边距

   *{ margin:; padding:; }

但是使用通配符选择器,会遍历所有的元素,对网页的性能会有影响,为了减少对网页性能的损耗,我们采用另外一种方法,看一下大型网站是怎么做的  Yui 的雅虎开发的一个框架,

我们看下  yui 是怎么做的

在百度输入  yui css reset

结果如下:

上图中初始化 html 元素的 代码如下:

 html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:;padding:}table{border-collapse:collapse;border-spacing:}fieldset,img{border:}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;*font-size:100%}legend{color:#000}#yui3-css-stamp.cssreset{display:none}

其中,清除边框的代码如下:

             body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
legend,
input,
textarea,
p,
blockquote,
th,
td {
margin:;
padding: 0
}

所以,以后清除元素边框的边距,直接写以上代码就好了

如何清空css 的默认边距的更多相关文章

  1. CSS清除默认边距

    body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquo ...

  2. H5 54-清空默认边距

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. HTML标签CSS属性默认值汇总

    HTML标签CSS属性默认值,在你需要还原默认值的时候比较有用. 以前一直在找这份文档,今天偶然在网上看到了.除了inline和block的定义,主要是要注意body|h1~h6|blockquote ...

  4. css - 盒子内外边距

    css - 盒子内外边距 元素内边距 内边距是指元素包含的内容离元素边框之间的间距,padding会撑大盒子.在浏览器中显示的元素宽高包含了padding. div{     width:200px; ...

  5. css清除默认样式

    CSS 清除默认样式   通常有以下几句就够了: *{margin:0;padding:0} li{list-style:none} img{vertical-align:top;border:non ...

  6. CSS Margin(外边距)

    CSS Margin(外边距) 一.简介 CSS margin(外边距)属性定义元素周围的空间. margin 清除周围的(外边框)元素区域.margin 没有背景颜色,是完全透明的. margin ...

  7. 用纯css改变默认的radio和checkbox的样式

    利用css的label的伪类(::before)代替checkbox和radio效果: 优点:需要图片来调整选中前和选中后的样式,纯css搞定 缺点:兼容性,IE8以下不支持 在线例子: css改变默 ...

  8. Eclipse创建JSP、HTML、CSS文件默认字符集设置成UTF-8

    问题:在使用eclipse的时候总是发现新创建的JSP文件.HTML文件等默认总是ISO-8859-1,每次都要修改成自己使用的utf-8的,很是麻烦,因此在网上查看了一下发现是可以修改字符集的默认值 ...

  9. 浅析 CSS 中的边距重叠

    浅析 CSS 中的边距重叠 边距重叠是什么 在说边距重叠之前,先以正常的思维来考虑如果你现在是浏览器引擎遇到这种情况应该怎么办? 现在有两个元素 div1 和 div2 紧挨着,中间没有它元素,它们的 ...

随机推荐

  1. Open Distro for Elasticsearch – How Different Is It?

    转自:https://logz.io/blog/open-distro-for-elasticsearch Last month, AWS announced an initiative called ...

  2. 游戏人工智能编程案例精粹(修订版) (Mat Buckland 著)

    https://www.jblearning.com/catalog/productdetails/9781556220784 第1章 数学和物理学初探 (已看) 第2章 状态驱动智能体设计 (已看) ...

  3. WinForm关于更新程序的设计思路

    开发WINDOWS应用程序一般都会有一个自动更新的功能,这就需要提供一个单独的更新程序来更新主程序,那么主程序怎么检测是否有更新,以及更新程序怎么去更新主程序呢?下面将分开研究分析. 用VS发布向导发 ...

  4. haproxy反向代理

    haproxy是个高性能的tcp和http的反向代理.它就是个代理.不像nginx还做web服务器 官网地址为www.haproxy.org nginx的优点和缺点 优点: 1.web服务器,应用比较 ...

  5. Day 22 初识面向对象

    一.两种编程思想 1.面向过程编程 核心是'过程',过程指的是解决问题的步骤,就是先干什么再干什么 基于面向过程思想编写程序相当于写一条流水线,是一种机械式的思维方式 优点:解决问题的思路清晰,可以把 ...

  6. myEclipse+Spring boot+Hbuilder+jwt Token+mongoDB+企业微信H5开发

    企业微信应用的H5开发 1.参考文档:weUI:http://jqweui.com/ 2.企业微信接口文档:https://work.weixin.qq.com/api/doc#10029 3.百度地 ...

  7. 嵌入式C语言常见的错误

    预处理的错误: #include “stdio.h”   //引用符号错误 #inlcude <name>  //自定义文件用 "  " not find gcc -I ...

  8. MongoDB解压报错gzip: stdin: not in gzip format的解决方法

    MongoDB解压报错gzip: stdin: not in gzip format的解决方法 在安装MongoDB时出现如下报错: [root@vm172--- mongodb]# tar -zxv ...

  9. 【C++】Lambda表达式

    转自 https://www.cnblogs.com/DswCnblog/p/5629165.html 作者:dsw846 C++11的一大亮点就是引入了Lambda表达式.利用Lambda表达式,可 ...

  10. RAM和Flash区别

    都是随机存储器,断电数据消失,但Flash有点不一样,它在消失数据之前,添加了一个""性质",这个性质能上电后再识别,且把这个信号返回到ram中,这样近似的把flash当 ...