购物车
登陆 / 注册
微信扫码登陆

推荐手册

CSS 填充(padding)

CSS 填充(padding)
元素的内边距指的是在边框和内容区之间,通过padding属性定义元素边框与元素内容之间的空白区域
编辑:前端控 前端控 更新时间:2019-03-22 14:50:36

CSS padding(填充)

元素的内边距指的是在边框和内容区之间,通过padding属性定义元素边框与元素内容之间的空白区域

padding的值:

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

 单边内边距属性

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

  • padding-top

  • padding-right

  • padding-bottom

  • padding-left

实例

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
p 
{
background-color: pink;
padding-top:25px;
padding-bottom:25px;
padding-right:50px;
padding-left:50px;
}
</style>
</head>
<body>
<p>HTML中文网</p>
</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

 效果图:

值复制:

通过值复制,不用重复地键入这对数字

padding:25px 50px 75px 100px;

上填充为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设置元素的顶部填充
网站导航
网站首页
学习路径
视频教程
开发软件
旗下子站
php中文网
phpstudy
技术文章
文档工具
关于我们
企业合作
人才招聘
联系我们
讲师招募
QQ交流群
QQ交流群
微信公众号
微信公众号