语法:

padding:[ <length> | <percentage> ]{1,4}

默认值:看每个独立属性

适用于:所有元素,除 table-row-group | table-header-group | table-footer-group | table-column-group | table-row 外

继承性:无

动画性:是

计算值:看每个独立属性

相关属性:[ padding-top ] || [ padding-right ] || [ padding-bottom ] || [ padding-left ]

取值:

<length>: 用长度值来定义内补白。不允许负值
<percentage>: 用百分比来定义内补白。水平(默认)书写模式下,参照其包含块 width进行计算,其它情况参照 height 。不允许负值

说明:

检索或设置对象四边的内部边距。

  • 如果提供全部四个参数值,将按上、右、下、左的顺序作用于四边。
  • 如果只提供一个,将用于全部的四边。
  • 如果提供两个,第一个用于上、下,第二个用于左、右。
  • 如果提供三个,第一个用于上,第二个用于左、右,第三个用于下。
  • 非替代(non-Replaced)行内元素可以使用该属性设置左、右两边的内补丁;若要设置上、下两边的内补丁,必须先使该对象表现为块级或内联块级。
  • 对应的脚本特性为padding

TRBL


引申: margin,border

padding的值缩写



padding : 20px;  ==  padding : 20px 20px 20px 20px;

padding : 20px 10px;  == padding : 20px 10px 20px 10px;

padding : 20px 10px 30px == padding : 20px 10px 30px 10px;

对面相等,后者省略; 4面相等,只设一个

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>padding 填充</title>
<style type="text/css">
div,span{
border: 1px dashed red;
}
.sample0{
padding: 20px;
}
.sample1{
padding: 40px 30px 20px 10px;
}
.sample2{
padding: 20px 10px 20px;
} .parent{
padding:20px;
} .child{
border: 1px solid blue;
}
</style>
</head>
<body>
<div class="sample0">sample</div>
<br>
<div class="sample1">sample</div>
<br>
<div class="sample2">sample</div>
<br>
<div class="parent">
<div class="child">child </div>
</div>
</body>
</html>

css padding 填充的更多相关文章

  1. CSS Padding(填充)

    CSS Padding(填充)属性定义元素边框与元素内容之间的空间. Padding(填充) 当元素的 Padding(填充)(内边距)被清除时,所"释放"的区域将会受到元素背景颜 ...

  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. boa + ajax + cgi ajax请求cgi

    最近公司要做一个通讯管理机,然后需要和另外一个同事一起做,我们需要用到boa+Ajax+CGI,以前没试过与CGI交互,一开始发现问题挺大的,用ajax请求cgi,总是不返回数据,又或者请求回来的是c ...

  2. Openfire/XMPP学习之——一个简单的Smack样例

    昨天讲了Openfire的搭建和配置,今天来讲一下Smack.如果对如何搭建和配置Openfire的,可以参考Openfire/XMPP学习之——Openfire的安装.配置. Smack是一个开源, ...

  3. CSS三种写法的优先级

    在HTML文件中引入CSS样式有三种方法: 外部样式:通过link标签引入CSS样式: 内页样式:写在HTML页面里面的style标签里面: 行内样式:写在对应标签的style属性里面. 我知道一般情 ...

  4. geotrellis使用(十四)导出定制的GeoTiff

    Geotrellis系列文章链接地址http://www.cnblogs.com/shoufengwei/p/5619419.html 目录 前言 需求说明 实现方案 总结 一.前言        最 ...

  5. TreeView控件使用

    treeView1.SelectedNode = treeView1.Nodes[0];  //选中当前treeview控件的根节点为当前节点添加子节点:  TreeNode tmp; tmp = n ...

  6. Android TextView中显示图片

    Android官方给我们提供的Html类下面的fromHtml方法 当你需要转换的HTML代码是带图片的,比如<IMG/>,那么你就需要使用到重载的第二个方法了,这个方法里面有个Image ...

  7. 魔方渗透系统安装VMtools教程

    虚拟机魔方渗透系统安装VMtools教程 1.开机登陆后,如图点击安装VMtools. 2.进入media文件夹: cd /media   查看mdia文件夹内容: ls   3.打开VMware T ...

  8. PHP中的魔术方法(2)

    1.__get.__set这两个方法是为在类和他们的父类中没有声明的属性而设计的__get( $property ) 当调用一个未定义的属性时访问此方法__set( $property, $value ...

  9. Win10 UWP系列:更新UWP时注意的问题——TargetDeviceFamily

    前几天把CurrencyExchanger提交到微软参加Master认证,结果没有通过,反馈了一些错误,看来微软检查还是比较仔细的. 错误主要有: Visual feedback helps user ...

  10. ASP.NET Core 开发-中间件(Middleware)

    ASP.NET Core开发,开发并使用中间件(Middleware). 中间件是被组装成一个应用程序管道来处理请求和响应的软件组件. 每个组件选择是否传递给管道中的下一个组件的请求,并能之前和下一组 ...