CSS 内边距

元素的内边距在边框和内容区之间。控制该区域最简单的属性是 padding 属性。

CSS padding 属性定义元素边框与元素内容之间的空白区域。

CSS padding 属性

CSS padding 属性定义元素的内边距。padding 属性接受长度值或百分比值,但不允许使用负值。

例如,如果您希望所有 h1 元素的各边都有 10 像素的内边距,只需要这样:h1 {padding: 10px;}

您还可以按照上、右、下、左的顺序分别设置各边的内边距,各边均可以使用不同的单位或百分比值:h1 {padding: 10px 0.25em 2ex 20%;}

单边内边距属性

也通过使用下面四个单独的属性,分别设置上、右、下、左内边距:padding-top

padding-right

padding-bottom

padding-left

您也许已经想到了,下面的规则实现的效果与上面的简写规则是完全相同的:h1 {

padding-top: 10px;

padding-right: 0.25em;

padding-bottom: 2ex;

padding-left: 20%;

}

内边距的百分比数值

前面提到过,可以为元素的内边距设置百分数值。百分数值是相对于其父元素的 width 计算的,这一点与外边距一样。所以,如果父元素的 width 改变,它们也会改变。

下面这条规则把段落的内边距设置为父元素 width 的 10%:p {padding: 10%;}

例如:如果一个段落的父元素是 div 元素,那么它的内边距要根据 div 的 width 计算。

This paragragh is contained within a DIV that has a width of 200 pixels.

注意:上下内边距与左右内边距一致;即上下内边距的百分数会相对于父元素宽度设置,而不是相对于高度。

CSS 内边距属性属性描述

padding简写属性。作用是在一个声明中设置元素的所内边距属性。

auto浏览器计算内边距。

length规定以具体单位计的内边距值,比如像素、厘米等。默认值是 0px。

%规定基于父元素的宽度的百分比的内边距。

inherit规定应该从父元素继承内边距。

padding-bottom设置元素的下内边距。

length规定以具体单位计的固定的下内边距值,比如像素、厘米等。默认值是 0px。

%定义基于父元素宽度的百分比下内边距。此值不会如预期地那样工作于所有的浏览器中。

inherit规定应该从父元素继承下内边距。

padding-left设置元素的左内边距。

length规定以具体单位计的固定的左内边距值,比如像素、厘米等。默认值是 0px。

%定义基于父元素宽度的百分比左内边距。此值不会如预期地那样工作于所有的浏览器中。

inherit规定应该从父元素继承左内边距。

padding-right设置元素的右内边距。

length规定以具体单位计的固定的左内边距值,比如像素、厘米等。默认值是 0px。

%定义基于父元素宽度的百分比左内边距。此值不会如预期地那样工作于所有的浏览器中。

inherit规定应该从父元素继承左内边距。

padding-top设置元素的上内边距。

length规定以具体单位计的固定的左内边距值,比如像素、厘米等。默认值是 0px。

%定义基于父元素宽度的百分比左内边距。此值不会如预期地那样工作于所有的浏览器中。

inherit规定应该从父元素继承左内边距。

php 表格内边距,CSS 内边距相关推荐

  1. html怎么设置左侧内边距,CSS 内边距(Padding)

    CSS 内边距(Padding) CSS 内边距(Padding)属性定义元素边框与元素内容之间的空间.有时候也称CSS 内边距(Padding)为 填充(Padding). 内边距(Padding) ...

  2. php内外边距,CSS 内边距

    CSS 内边距 元素的内边距在边框和内容区之间.控制该区域最简单的属性是 padding 属性. CSS padding 属性定义元素边框与元素内容之间的空白区域. CSS padding 属性 CS ...

  3. html+p外边距,CSS外边距

    CSS外边距是围绕在元素边框的空白区域.设置外边距会在元素外创建额外的"空白".设置外边距的最简单的方法就是使用 margin 属性,这个属性接受任何长度单位.百分数值甚至负值. ...

  4. 在html中设置外边距,CSS外边距设置属性margin用法

    本文向大家描述一下CSS外边距属性margin的用法,设置外边距的最简单的方法就是使用margin属性,这个属性接受任何长度单位.百分数值甚至负值,相信本文介绍一定会让你有所收获. CSS外边距 围绕 ...

  5. css怎样清除外边距,CSS 外边距

    CSS 外边距 围绕在元素边框的空白区域是外边距.设置外边距会在元素外创建额外的"空白". 设置外边距的最简单的方法就是使用 margin 属性,这个属性接受任何长度单位.百分数值 ...

  6. html css外边距,CSS外边距合并

    块的顶部外边距和底部外边距有时被组合(折叠)为单个外边距,其大小是组合到其中的最大外边距,这种行为称为外边距塌陷(margin collapsing),有的地方翻译为外边距合并. 发生外边距塌陷的三种 ...

  7. Css内边距与外边距

    Css内边距与外边距 Css内边距 Css外边距margin Css外边距margin 设置外边距最简单的方法就是margin属性.margin属性接受任何长度单位,可以是像素,英寸,毫米或em ma ...

  8. html外边距有哪些,css外边距是什么?css外边距属性的介绍

    在学习css的时候,会css外边距这一概念,所以,css外边距是什么呢?边框以外就是外边距,外边距默认是透明的,因此不会遮挡其后的任何元素,接下来本篇文章将来给大家介绍关于css外边距属性的相关内容. ...

  9. CSS 内边距 padding 属性

    CSS padding 属性定义元素边框与元素内容之间的空白区域. ㈠padding(填充) ⑴当元素的 padding(填充)内边距被清除时,所释放的区域将会受到元素背景颜色的填充. ⑵单独使用 p ...

  10. html内外边距怎么设置,css内边距怎么设置?

    在前端开发中经常会使用css盒子模型,一般我们会通过css设置width(宽度),padding(内边距),margin(外边距)等属性可以调节整个盒子的大小. 下面我们来看一下设置padding(内 ...

最新文章

  1. 引用计数(Reference Counting)和代理(Proxy)的应用
  2. nginx服务器远程无法访问,客户端连接Nginx偶尔提示无法连接到远程服务器
  3. oracle中获取年份、月份段内的时间
  4. 全程图解交换机和路由器的应用
  5. JDBC之二:DAO模式
  6. python中的ans是什么意思_python ans
  7. matlab多缝夫琅禾费,常见的多缝夫琅禾费衍射.ppt
  8. java实现layui静态表格分页,layui——数据表格分页实例
  9. element筛选 ajax,vue使用element Transfer 穿梭框实现ajax请求数据和自定义查询
  10. DFMZ-开发过程中遇到的错误-01
  11. AtCoder Beginner Contest 178 C
  12. MATLAB批量绘图
  13. Oracle数据库字段翻译
  14. JVM探秘:垃圾收集器
  15. Flutter 转 null safe时报错: The argument type ‘Object‘ can‘t be assigned to the parameter type XXX
  16. jenkins创建流水线,基于gitlab与Jenkinsfile
  17. PreScan快速入门到精通第二十八讲PreScan中常用传感器之TIS传感器
  18. Anaconda启动一直停留在loading applications解决方法
  19. Mobox项目文档管理-项目经理必备工具
  20. C++学习之回调函数

热门文章

  1. 如果能重来,我不会选择北漂——初见北京
  2. 浏览器提示“此网站的安全证书有问题“,你还敢继续访问吗?
  3. 坦白从宽,牢底坐穿?留学生如何应对美警察审问~~
  4. Chrome 插件下载网站+6个实用插件推荐
  5. 后台传给小程序的时间对象如何转为“YYYY/MM/DD“格式渲染
  6. 关于桌面文件,软件图标,带蓝底白问号的解决方法
  7. GitHub 近两万 Star,无需编码,可一键生成前后端代码
  8. U8-存货结存数量与序列号可用数量不一致
  9. PPP PDP 及GPRS
  10. 可编辑!热门动态表情包!