```
内边距: padding
```
作用:设置宽度和高到边框的间距
<p style="color:red">特点:不能加载内容,但是可以加载背景
特点:如果文字标签p等文字标签使用则会内缩文字,如果是盒子标签使用则会外撑高或者撑宽盒子。 </p>
属性名:padding
属性值为px 为单位i的数值
padding 属性是一个综合属性,可以根据不同方向进行设置
```
padding-top
//上
padding-bottom
//下
padding-left
//左
padding-right
//右
```
四值法:
```
padding:4px; 上下左右分别具有4像素
padding:2px 4px; 上下为二像素,左右为4像素
padding:10px 20px 30px 上:10px 左、右:20px 下:30px
padding:1px 2px 3px 4px 上:1px 右:2px 下:3px 左:4px
```
代码
```
.ps{
width:100px;
padding:20px30px20px30px;
background-color: sienna;
}
<div class="ps">
<p>我是文字</p>
</div>
```
效果:
![](https://img.kancloud.cn/c0/ca/c0ca075b542e8cccc7061681066232c0_930x401.png)
- 简介
- 文字三属性(颜色,字号,字体)
- 盒子三属性(width , height, background-color)
- CSS引入方法
- CSS选择器
- css高级选择器
- CSS的继承性
- 颜色属性color
- 字体font-family
- 字号font-size
- 文字在盒子行高 line-height
- 字体加粗font-weight
- 字体样式font-style
- 文本段落对齐text-align
- 文字修饰(上划线下划线中划线 text-decoration)
- 文字缩进text-indent
- 盒子模型的宽度与高度width,height
- 内边距padding
- 边框border
- 外边距margin
- 清除默认样式
- 盒子height高度属性拓展
- 文字在盒子里居中text-align:center
- 盒子在盒子里的水平居中
- margin塌陷
- 标准文档流display
- 浮动float
- 浮动元素性质
- 浮动贴边原理
- 浮动元素的标准流问题(文字围边效果)
- 清除浮动
- 清除浮动影响二: clear属性
- 清除浮动overflow方法
- 伪类标签
- background-color背景颜色属性
- background-image 背景图片调用
- background-repeat 背景图平铺状态
- background-position背景定位
- background-attachment背景附着
- background综合语法
- 相对定位position:relative
- 绝对定位position:absolute
- 定位压盖顺序
- CSS制作LOGO超链接妙招
- CSS公共类的继承性
- em单位
- 媒体查询
- flex布局