padding有一个陷阱,你平常可能不太注意。

行内元素上设置的内边距不会影响行高计算;因此,如果一个行内元素既有内边距又有背景,从视觉上看可能会延伸到其他行,有可能还会与其他内容重叠。

对于块元素,利用padding结合box-sizing可以轻松制作类似 三列高度相等,左右宽度固定,中间自适应的布局,

box-sizing有两种方式 border-box  content-box

需要注意的是对于火狐,box-sizing属性居然需要加前缀  -moz-box-sizing,而且它还支持第三种格式:padding-box

各种浏览器都有神奇的地方。神啊,这真是既痛苦又有乐趣啊。

分久必合,合久必分。HTML5来解放我们一段时间吧。

padding的讲究的更多相关文章

  1. web兼容学习分析笔记-margin 和padding浏览器解析差异

    二.margin 和padding浏览器解析差异 只有默认margin的元素 <body>margin:8px  margin:15px 10px 15px 10px(IE7) <b ...

  2. padding标准盒模型和怪异盒子模型

    我们都知道padding是为块级元素设置内边距 但是在使用过程中,我们却会遇到一些问题.padding的标准盒模型和怪异盒模型 padding盒子模型 我们通过demo来讲这个问题,用文字干讲第一没意 ...

  3. padding/border与width的关系

    本文讲述 padding / border 的设置后是否对 width 有影响,width 等于 auto 与 100% 的区别 CSS 框模型 (Box Model) 规定了元素框处理元素内容.内边 ...

  4. CSS padding margin border属性详解

    图解CSS padding.margin.border属性W3C组织建议把所有网页上的对像都放在一个盒(box)中,设计师可以通过创建定义来控制这个盒的属性,这些对像包括段落.列表.标题.图片以及层. ...

  5. css padding 填充

    语法: padding:[ <length> | <percentage> ]{1,4} 默认值:看每个独立属性 适用于:所有元素,除 table-row-group | ta ...

  6. W3School-CSS 内边距 (padding) 实例

    CSS 内边距 (padding) 实例 CSS 实例 CSS 背景实例 CSS 文本实例 CSS 字体(font)实例 CSS 边框(border)实例 CSS 外边距 (margin) 实例 CS ...

  7. margin和padding的区别

    目前web2.0已经越来被人们认可,因为喜欢搞web开发的人员不得不硬着头皮去学习web2.0的标准,其中很重要的一条就是新的布局规则,div+css.以前基本上是用table布局的,这种传统的方式简 ...

  8. padding

    padding-top:20px;上内边距 padding-right:30px;右内边距 padding-bottom:30px;下内边距 padding-left:20px;左内边距 paddin ...

  9. 浅谈Margin和Padding值设置成百分数的布局

    转自:问说网http://www.uedsc.com/discussion-margin-and-padding-values.html Margin和Padding是我们在网页设计经常使用到的CSS ...

随机推荐

  1. shell-变量的数值运算符-计算双括号(())的使用

    1. 变量的数值计算 变量的数值计算常见的如下几个命令: (()).let.expr.bc.$[]  1) (())用法:(此法很常用,且效率高) 执行简单的整数运算,只需将特定的算术表达式用 &qu ...

  2. 将本地代码初始化上传到gitlab仓库

    首先你已经安装了git. 1.在本地代码目录,鼠标右键Git Bash Here: 2.执行git命令,此命令会在当前目录下创建一个.git文件夹, git init 3.将项目的所有文件添加到仓库中 ...

  3. linq 整理(前序)

    前言 对linq进行整理,分为前序.中序和后序. 前序就是一些简单的概念和模拟. 中序的话就是深挖一些思想. 后序对其进行解刨. 正文 语言集成查询 (LINQ) 是一系列直接将查询功能集成到 C# ...

  4. C#数据结构-链栈

    上一篇我们通过数组结构实现了栈结构(准确的说是栈的顺序存储结构),现在我们通过链(单链)存储栈,也就是链栈. 通常对于正向单链表来说,是从头节点开始,在链的尾部附加节点,前一个节点的指针指向附加节点: ...

  5. 【Linux编译环境的搭建】Linux都没有,怎么学Linux编程?

    本文准备从0开始,一步步搭建一套属于自己的多节点Linux系统环境,这将是后续学Linux.用Linux.Linux环境编程.应用和项目部署.工具实验等一系列学习和实践的基石,希望对小伙伴们有帮助. ...

  6. 扫描仪扫描文件处理-ABBYY对扫描版PDF文字加黑加粗、去除背景漂白

    1. 设置ABBYY自动歪斜矫正: 2. 设置导出PDF参数: 3. PDF文字加黑加粗.去除背景漂白步骤:3.1 ABBYY - 打开扫描版PDF文档3.2 ABBYY - 编辑图像3.3 等级 - ...

  7. mysql8在生产环境中的配置

    一,配置文件的位置 [root@yjweb ~]# ll /etc/my.cnf -rw-r--r-- 1 root root 935 Mar 11 16:52 /etc/my.cnf 说明:通常我们 ...

  8. 笔趣阁小说 selenium爬取

    import re from time import sleep from lxml import etree from selenium import webdriver options = web ...

  9. PHP字符串如何转换成if条件语句

    例如: $condition = "2 == 2 && 3 == 5"; if ( $condition ){ echo 1; } 怎样把 $condition 转 ...

  10. 某次burp抓包出错的解决办法

    前些日子同事发微信问我一个问题 没听懂他说的没回显是啥意思,于是叫他把站发给我. 浏览器不挂burp代理能正常打开,挂上burp代理以后浏览器显示连接超时 首先测试burp能抓其他的包应不是这个原因 ...