CSS Padding(填充)属性定义元素边框与元素内容之间的空间。


Padding(填充)

当元素的 Padding(填充)(内边距)被清除时,所"释放"的区域将会受到元素背景颜色的填充。

单独使用填充属性可以改变上下左右的填充。缩写填充属性也可以使用,一旦改变一切都改变。

可能的值

说明
length 定义一个固定的填充(像素, pt, em,等)
% 使用百分比值定义一个填充

填充- 单边内边距属性

在CSS中,它可以指定不同的侧面不同的填充:

实例

padding-top:25px;
padding-bottom:25px;
padding-right:50px;
padding-left:50px;

尝试一下 »


填充 - 简写属性

为了缩短代码,它可以在一个属性中指定的所有填充属性。

这就是所谓的缩写属性。所有的填充属性的缩写属性是"padding":

实例

padding:25px 50px;

尝试一下 »

Padding属性,可以有一到四个值。

  • 上填充为25px
  • 右填充为50px
  • 下填充为75px
  • 左填充为100px

  padding:25px 50px 75px;

  • 上填充为25px
  • 左右填充为50px
  • 下填充为75px

  padding:25px 50px;

  • 上下填充为25px
  • 左右填充为50px

  padding:25px;

  • 所有的填充都是25px

更多实例

在一个声明中的所有填充属性
这个例子演示了使用缩写属性设置在一个声明中的所有填充属性,可以有一到四个值。

设置左部填充
这个例子演示了如何设置元素左填充。

设置右部填充
这个例子演示了如何设置元素右填充。.

设置上部填充
这个例子演示了如何设置元素上填充。

设置下部填充
这个例子演示了如何设置元素下填充。


所有的CSS填充属性

属性 说明
padding 使用缩写属性设置在一个声明中的所有填充属性
padding-bottom 设置元素的底部填充
padding-left 设置元素的左部填充
padding-right 设置元素的右部填充
padding-top 设置元素的顶部填充

CSS Padding(填充)的更多相关文章

  1. css padding 填充

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

  2. CSS:CSS padding(填充)

    ylbtech-CSS:CSS padding(填充) 1.返回顶部 1. CSS padding(填充) CSS padding(填充)是一个简写属性,定义元素边框与元素内容之间的空间,即上下左右的 ...

  3. CSS padding

    CSS padding 是用来控制div table 内间距的,下面我们就来讲一下padding 实例吧.   CSS padding 利用CSS填充,你将能够更改默认的间隙内出现的各种HTML元素( ...

  4. CSS3——盒子模型 border(边框) 轮廓(outline)属性 margin外边距 padding填充

    盒子模型 包括——边距,边框,填充,和实际内容 Margin(外边距) - 清除边框外的区域,外边距是透明的. Border(边框) - 围绕在内边距和内容外的边框. Padding(内边距) - 清 ...

  5. padding 填充

    CSS padding(填充)是一个简写属性,定义元素边框与元素内容之间的空间,即上下左右的内边距. padding(填充) 当元素的 padding(填充)内边距被清除时,所释放的区域将会受到元素背 ...

  6. CSS padding margin border属性详解

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

  7. CSS padding margin border属性详解【转载】

    本文转载自:http://www.cnblogs.com/linjiqin/p/3556497.html ,感谢相关博主. 图解CSS padding.margin.border属性 W3C组织建议把 ...

  8. 转-CSS padding margin border属性详解

    原文链接:http://www.cnblogs.com/linjiqin/p/3556497.html 图解CSS padding.margin.border属性W3C组织建议把所有网页上的对像都放在 ...

  9. 【转】图解CSS padding、margin、border属性

    http://www.cnblogs.com/linjiqin/p/3556497.html 图解CSS padding.margin.border属性W3C组织建议把所有网页上的对像都放在一个盒(b ...

随机推荐

  1. Delphi 继承基类的窗体,并显示基类的控件操作。

    1.  先建一个普通的窗体,until1 2.  先把类实现基类, 并需要实现基类需要继承的方法, 可以先不用再方法中写实现代码. TForm4 = class(TfrmmtAReportPeriod ...

  2. NIO的学习

    参考 http://wenku.baidu.com/link?url=rq-BEp3Et4JRrE62f2Lv9hq8nT_Gq0XPb65h8OBqTAt-ILfqKmdjIhVEp8bctIdm0 ...

  3. Ubuntu12.04-64bits搭建FFmpeg环境

    所有的环境搭建动作请参考FFMpeg官方网站:http://www.ffmpeg.org/index.html 1. 获取源代码: git clone git://source.ffmpeg.org/ ...

  4. ActiveMQ使用总结

    一.下载使用: 官网下载apache-activemq-5.8.0-bin.tar.gz.apache-activemq-5.8.0-bin.zip 解压,然后启动ActiveMQ服务器 方法1: 直 ...

  5. AppiumLibrary实用函数介绍

    1. 点击按钮: Click Button index_or_name Click button 实例:Click Button index=0 作者通过实验发现在安卓手机应用测试中,name这个属性 ...

  6. Pgsql数据库jsonb操作函数集合

    CREATE OR REPLACE FUNCTION "json_object_del_path"( "json" json, "key_path&q ...

  7. PostgreSQL9.5 新特性

    PostgreSQL9.5 新特性 PostgreSQL9.5:Foreign Table Inheritance PostgreSQL9.5:Row-Level Security Policies ...

  8. park、unpark、ord 函数使用方法(转)

    park,unpark,ord这3个函数,在我们工作中,用到它们的估计不多. 我在最近一个工作中,因为通讯需要用到二进制流,然后接口用php接收.当时在处理时候,查阅不少资料.因为它们使用确实比较少, ...

  9. spring beans源码解读之--XmlBeanFactory

    导读: XmlBeanFactory继承自DefaultListableBeanFactory,扩展了从xml文档中读取bean definition的能力.从本质上讲,XmlBeanFactory等 ...

  10. Pivotal Cloud Foundry学习笔记(1)

    PCF是一个PAAS平台 注册PCF账号 https://account.run.pivotal.io/sign-up 安装cf CLI 访问 https://console.run.pivotal. ...