内边距属性

来源：互联网发布：js日期格式化yyyymmdd 编辑：程序博客网时间：2024/06/14 06:05

之前在学习HTML的时候就已经说过了什么是内边距。

所谓的内边距就是内容和边框之间的距离。

-----------------------------------------------------分割线------------------------------------------------------

语法格式：

①非连写：

padding-top: ;

padding-right: ;

padding-bottom: ;

padding-left: ;

例如：

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>分页</title>    <style type="text/css">      /*.box{*/          /*width:100px;*/          /*height: 100px;*/          /*background: red;*/         /*border-width: 10px 5px 1px;*/          /*border-style: solid;*/        /*}*/        .six1   {            width: 200px;            height:200px;            background: red;            padding-top: 20px;        }    </style></head><body>        <!--<div class="box"></div>-->        <div class="six1">aaa</div>        <div class="six2"></div>        <div class="six3"></div>        <div class="six4"></div></body></html>

②连写：

padding: 上右下左;

这里的一些注意点都是和边框属性是一样的，比如有三个值，两个值，一个值等等。

-----------------------------------------------------分割线------------------------------------------------------

注意点：

①设置完内边距之后，边框会发生高度和宽度上的变化

②内边距也是会有背景颜色的

----------------------------------------------------分割线---------------------------------------------------

0 0