常用元素默认margin和padding值问题探讨
关于默认元素在不同浏览器中的margin值是多少的问题,今天做了一个探讨
代码如下:
firefox 20.0 ----------------------- body的margin为: margin:8px 8px 8px 8px;
Internet Explorer 6.0 ----------- body的margin为: margin:15px 10px 15px 10px;
Internet Explorer 7.0 ----------- body的margin为: margin:16px 11px 16px 11px;
Internet Explorer 8.0-10.0 ---- body的margin为: margin:16px 8px 16px 8px;
Opera 12.11 --------------------- body的margin为: margin:16px 8px 16px 8px;
Safari 5.1 ------------------------- body的margin为: margin:16px 8px 16px 8px;
Google Chrome 27.0 --------- body的margin为: margin:16px 8px 16px 8px;
// h1的margin值
firefox 20.0 ----------------------- h1的margin为: margin:21px 0 22px 0;
Internet Explorer 6.0 ----------- h1的margin为: margin:19px 0 19px 0;
Internet Explorer 7.0 ----------- h1的margin为: margin:19px 0 19px 0;
Internet Explorer 8.0-10.0 ---- h1的margin为: margin:20px 0 20px 0;
Opera 12.11 --------------------- h1的margin为: margin:21px 0 21px 0;
Safari 5.1 ------------------------- h1的margin为: margin:21px 0 21px 0;
Google Chrome 27.0 --------- h1的margin为: margin:21px 0 22px 0;
// h2的margin值
firefox 20.0 ----------------------- h2的margin为: margin:20px 0 20px 0;
Internet Explorer 6.0 ----------- h2的margin为: margin:19px 0 19px 0;
Internet Explorer 7.0 ----------- h2的margin为: margin:19px 0 19px 0;
Internet Explorer 8.0-10.0 ---- h2的margin为: margin:20px 0 20px 0;
Opera 12.11 --------------------- h2的margin为: margin:19px 0 19px 0;
Safari 5.1 ------------------------- h2的margin为: margin:19px 0 19px 0;
Google Chrome 27.0 --------- h2的margin为: margin:20px 0 20px 0;
// h3的margin值
firefox 20.0 ----------------------- h3的margin为: margin:19px 0 18px 0;
Internet Explorer 6.0 ----------- h3的margin为: margin:19px 0 19px 0;
Internet Explorer 7.0 ----------- h3的margin为: margin:19px 0 19px 0;
Internet Explorer 8.0-10.0 ---- h3的margin为: margin:19px 0 18px 0;
Opera 12.11 --------------------- h3的margin为: margin:18px 0 18px 0;
Safari 5.1 ------------------------- h3的margin为: margin:18px 0 18px ;
Google Chrome 27.0 --------- h3的margin为: margin:19px 0 18px 0;
// h4的margin值
firefox 20.0 ----------------------- h4的margin为: margin:22px 0 21px 0;
Internet Explorer 6.0 ----------- h4的margin为: margin:19px 0 19px 0;
Internet Explorer 7.0 ----------- h4的margin为: margin:19px 0 19px 0;
Internet Explorer 8.0-10.0 ---- h4的margin为: margin:22px 0 21px 0;
Opera 12.11 --------------------- h4的margin为: margin:16px 0 16px 0;
Safari 5.1 ------------------------- h4的margin为: margin:21px 0 21px 0;
Google Chrome 27.0 --------- h4的margin为: margin:22px 0 21px 0;
// h5的margin值
firefox 20.0 ----------------------- h5的margin为: margin:22px 0 22px 0;
Internet Explorer 6.0 ----------- h5的margin为: margin:19px 0 19px 0;
Internet Explorer 7.0 ----------- h5的margin为: margin:19px 0 19px 0;
Internet Explorer 8.0-10.0 ---- h5的margin为: margin:22px 0 22px 0;
Opera 12.11 --------------------- h5的margin为: margin:22px 0 22px 0;
Safari 5.1 ------------------------- h5的margin为: margin:22px 0 22px 0;
Google Chrome 27.0 --------- h5的margin为: margin:22px 0 22px 0;
// h6的margin值
firefox 20.0 ----------------------- h6的margin为: margin:25px 0 25px 0;
Internet Explorer 6.0 ----------- h6的margin为: margin:19px 0 19px 0;
Internet Explorer 7.0 ----------- h6的margin为: margin:19px 0 19px 0;
Internet Explorer 8.0-10.0 ---- h6的margin为: margin:25px 0 25px 0;
Opera 12.11 --------------------- h6的margin为: margin:24px 0 24px 0;
Safari 5.1 ------------------------- h6的margin为: margin:24px 0 24px 0;
Google Chrome 27.0 --------- h6的margin为: margin:28px 0 28px 0;
// dl的margin值
firefox 20.0 ----------------------- dl的margin为: margin:16px 0 16px 0;
Internet Explorer 6.0 ----------- dl的margin为: margin:19px 0 19px 0;
Internet Explorer 7.0 ----------- dl的margin为: margin:19px 0 19px 0;
Internet Explorer 8.0-10.0 ---- dl的margin为: margin:16px 0 16px 0;
Opera 12.11 --------------------- dl的margin为: margin:16px 0 16px 0;
Safari 5.1 ------------------------- dl的margin为: margin:16px 0 16px 0;
Google Chrome 27.0 --------- dl的margin为: margin:16px 0 16px 0;
// dd的margin值
firefox 20.0 ----------------------- dd的margin为: margin:0 0 0 40px;
Internet Explorer 6.0 ----------- dd的margin为: margin:0 0 0 40px;
Internet Explorer 7.0 ----------- dd的margin为: margin:0 0 0 40px;
Internet Explorer 8.0-10.0 ---- dd的margin为: margin:0 0 0 40px;
Opera 12.11 --------------------- dd的margin为: margin:0 0 0 40px;
Safari 5.1 ------------------------- dd的margin为: margin:0 0 0 40px;
Google Chrome 27.0 --------- dd的margin为: margin:0 0 0 40px;
// ul的margin值
firefox 20.0 ----------------------- ul的margin为: margin:16px 0 16px 0;
Internet Explorer 6.0 ----------- ul的margin为: margin:19px 0 19px 40px;
Internet Explorer 7.0 ----------- ul的margin为: margin:19px 0 19px 40px;
Internet Explorer 8.0-10.0 ---- ul的margin为: margin:16px 0 16px 0;
Opera 12.11 --------------------- ul的margin为: margin:16px 0 16px 0;
Safari 5.1 ------------------------- ul的margin为: margin:16px 0 16px 0;
Google Chrome 27.0 --------- ul的margin为: margin:16px 0 16px 0;
// ol的margin值
firefox 20.0 ----------------------- ol的margin为: margin:16px 0 16px 0;
Internet Explorer 6.0 ----------- ol的margin为: margin:19px 0 19px 40px;
Internet Explorer 7.0 ----------- ol的margin为: margin:19px 0 19px 40px;
Internet Explorer 8.0-10.0 ---- ol的margin为: margin:16px 0 16px 0;
Opera 12.11 --------------------- ol的margin为: margin:16px 0 16px 0;
Safari 5.1 ------------------------- ol的margin为: margin:16px 0 16px 0;
Google Chrome 27.0 --------- ol的margin为: margin:16px 0 16px 0;
// ul的padding值
firefox 20.0 ----------------------- ul的padding为: padding:0 0 0 40px;
Internet Explorer 6.0 ----------- ul的padding为: padding:0 0 0 0;
Internet Explorer 7.0 ----------- ul的padding为: padding:0 0 0 0;
Internet Explorer 8.0-10.0 ---- ul的padding为: padding:0 0 0 40px;
Opera 12.11 --------------------- ul的padding为: padding:0 0 0 40px;
Safari 5.1 ------------------------- ul的padding为: padding:0 0 0 40px;
Google Chrome 27.0 --------- ul的padding为: padding:0 0 0 40px;
// ol的padding值
firefox 20.0 ----------------------- ol的padding为: padding:0 0 0 40px;
Internet Explorer 6.0 ----------- ol的padding为: padding:0 0 0 0;
Internet Explorer 7.0 ----------- ol的padding为: padding:0 0 0 0;
Internet Explorer 8.0-10.0 ---- ol的padding为: padding:0 0 0 40px;
Opera 12.11 --------------------- ol的padding为: padding:0 0 0 40px;
Safari 5.1 ------------------------- ol的padding为: padding:0 0 0 40px;
Google Chrome 27.0 --------- ol的padding为: padding:0 0 0 40px;
// p的margin值
firefox 20.0 ----------------------- p的margin为: margin:16px 0 16px 0;
Internet Explorer 6.0 ----------- p的margin为: margin:19px 0 19px 0;
Internet Explorer 7.0 ----------- p的margin为: margin:19px 0 19px 0;
Internet Explorer 8.0-10.0 ---- p的margin为: margin:16px 0 16px 0;
Opera 12.11 --------------------- p的margin为: margin:16px 0 16px 0;
Safari 5.1 ------------------------- p的margin为: margin:16px 0 16px 0;
Google Chrome 27.0 --------- p的margin为: margin:16px 0 16px 0;
// thead,tbody,tfoot的margin值
firefox 20.0 ----------------------- thead,tbody,tfoot的margin为: margin:2px 2px 2px 2px;
Internet Explorer 6.0 ----------- thead,tbody,tfoot的margin为: margin:2px 2px 2px 2px;
Internet Explorer 7.0 ----------- thead,tbody,tfoot的margin为: margin:2px 2px 2px 2px;
Internet Explorer 8.0-10.0 ---- thead,tbody,tfoot的margin为: margin:2px 2px 2px 2px;
Opera 12.11 --------------------- thead,tbody,tfoot的margin为: margin:2px 2px 2px 2px;
Safari 5.1 ------------------------- thead,tbody,tfoot的margin为: margin:2px 2px 2px 2px;
Google Chrome 27.0 --------- thead,tbody,tfoot的margin为: margin:2px 2px 2px 2px;
// form的margin值
firefox 20.0 ----------------------- form的margin为: margin:0 0 0 0;
Internet Explorer 6.0 ----------- form的margin为: margin:19px 0 19px 0;
Internet Explorer 7.0 ----------- form的margin为: margin:19px 0 19px 0;
Internet Explorer 8.0-10.0 ---- form的margin为: margin:0 0 0 0;
Opera 12.11 --------------------- form的margin为: margin:0 0 0 0;
Safari 5.1 ------------------------- form的margin为: margin:0 0 0 0;
Google Chrome 27.0 --------- form的margin为: margin:0 0 0 0;
常用元素默认margin和padding值问题探讨的更多相关文章
- 关于IE处理margin和padding值超出父元素高度的问题
两个div,父div有padding值,子div有margin-top值,浏览器在解析实际父子位置关系时,他们之间的距离是父padding+子margin-top.现在把父div设置固定高度,并有意让 ...
- 浅谈Margin和Padding值设置成百分数的布局
转自:问说网http://www.uedsc.com/discussion-margin-and-padding-values.html Margin和Padding是我们在网页设计经常使用到的CSS ...
- inline元素的margin与padding
替换元素与非替换元素 替换元素(replaced element):所谓替换元素就是浏览器根据元素的标签和属性,来决定元素具体显示什么内容.比如说:img标签的src属性的值用来读取图片信息并且显示出 ...
- 块级元素及内联元素对margin、padding的态度
1.块级元素 margin:跟标准一样,设置该块级元素边框与同级兄弟元素或者父元素的距离,俗称外边距. padding:先延伸边框(也就是优先改变元素尺寸而不动元素中内容的位置),当边框碰到父元素的边 ...
- CSS——行内元素的margin与padding
行内元素: 1.margin:0 20px:只可以定义左右. 2.pading:20px 20px 20px 20px:上下左右都有效 例如span: <!DOCTYPE html> &l ...
- css 给inline和inline-block元素设置margin和padding
经过简单的测试,行内元素或者行内块元素的maring-left,margin-right,padding-left,padding-right都是可以正常表现的,下面来看一下剩下的margin-top ...
- css reset 以及哪些元素有默认margin padding值
很多网站在css reset 的时候有如下做法: body, ul, ol, li, p, h1, h2, h3, h4, h5, h6, form, label, dl, dt, dd,fields ...
- 总结那些有默认margin,padding值的html标签
一.h1~h6标签:有默认margin(top,bottom且相同)值,没有默认padding值. 在chrome中:16,15,14,16,17,19; 在firefox中:16,15,14,16, ...
- html标签默认属性值之margin;padding值
一.h1~h6标签:有默认margin(top,bottom且相同)值,没有默认padding值. 在chrome中:16,15,14,16,17,19; 在firefox中:16,15,14,16, ...
随机推荐
- UIImage imageNamed和UIImage imageWithContentsOfFile区别
UIImage imageNamed和 [UIImage imageWithContentsOfFile:[[NSBundle mainBundle] pathForResource:imageNam ...
- centos7下cups + samba共打印服务的教程
centos7系统我们用到的不多但是这款系统比centos6功能要强大了不少,下文来介绍一篇centos7下cups + samba,共打印服务的例子,具体如下所示. 这个算是rhce课程的篇外篇 ...
- 推荐一个linux下的web压力测试工具神器webbench
推荐一个linux下的web压力测试工具神器webbench2014-04-30 09:35:29 来源: 评论:0 点击:880 用多了apache的ab工具之后你就会发现ab存在很多问题, ...
- ios图标和默认图像
Icon.png和Default.png是两个重要的图像文件.Icon.png充当应用程序的图标,这些图标用于在SpringBoard主屏幕上表示应用程序.Default.png(也称"启动 ...
- MySQL报错:Packets larger than max_allowed_packet are not allowed 的解决方案
在导大容量数据特别是CLOB数据时,可能会出现异常:“Packets larger than max_allowed_packet are not allowed”. 这是由于MySQL数据库有一个系 ...
- 获取网页文档的URL和连接来源
<script type="text/javascript">document.write("链接来源:"+document.referrer+&q ...
- 15.含有指针成员的类的拷贝[ClassCopyConstructorWithPointerMember]
[题目] 下面是一个数组类的声明与实现.请分析这个类有什么问题,并针对存在的问题提出几种解决方案. C++ Code 123456789101112131415161718192021222324 ...
- 如何用BMFont制作图片字
1: 运行程序,单击鼠标左键点亮相应位置的字母,比如:0.1.2./ 等2: 选择 Edit->Open Image Manager.弹出一个“Image Manager" 对话框3: ...
- Java for LeetCode 187 Repeated DNA Sequences
All DNA is composed of a series of nucleotides abbreviated as A, C, G, and T, for example: "ACG ...
- Action返回类型
1.返回ascx页面return PartialView(); 2.Content(),返回文本ContentResultreturn Content("这是一段文本"); 3.J ...