css如何设置内边距

在css中，可以使用padding属性设置内边距，只需要给元素设置“padding:数值+单位|百分比数值”即可。padding属性设置元素所有内边距的宽度，或者设置各边上内边距的宽度。padding属性不允许指定负边距值。

本教程操作环境：windows7系统、CSS3& & HTML5版、Dell G3电脑。

我们来看一下设置padding（内边距）的方法：

我们的内间距是属于CSS盒模型之中的一种，那么现在我们来看看内间距都是怎么设置的吧。

padding： 是一个简写属性，可以设置一个声明中的所有内边距属性。

单独使用 padding 属性可以改变上下左右的填充。

可能的值：

length：定义一个固定的填充(像素, pt, em,等)

%：使用百分比值定义一个填充

用法：

padding-left 设置对象距离左边的边距补白间隔

div{
padding-left:5px}
    

对象内距离左边补白间距为5px

padding-right 设置对象距离右边的边距补白间隔

div{
padding-right:5px}
    

对象内距离右边补白间距为5px

padding-top 设置对象距离上边的边距补白间隔

div{
padding-top:5px}
    

对象内距离上边补白间距为5px

padding-bottom 设置对象距离下边的边距补白间隔

div{
padding-bottom:5px}
    

对象内距离下边补白间距为5px

说明

检索或设置对象四边的补丁边距。

如果提供全部四个参数值，将按上－右－下－左的顺序作用于四边。

如果只提供一个，将用于全部的四条边。

如果提供两个，第一个用于上－下，第二个用于左－右。

如果提供三个，第一个用于上，第二个用于左－右，第三个用于下。

内联对象要使用该属性，必须先设定对象的height或width属性，或者设定posITion属性为absolute。

Padding的值不能为负值。

实例：

!DOCTYPE html>
    html>
        head>
            meta charset="UTF-8">
            style>
            .css{
                     width:350px;
                     height:80px;
                     border:1px solid #00F;
                     padding-left:40px;
                    padding-right:40px;
                    padding-top:40px;
                    padding-bottom:40px;
                    /* 可以合起来写成padding:40px;
 */                }
         /style>
         /head>
        body>
            div class="css">
    padding用法/div>
        /body>
    /html>
    

效果图：

推荐学习：css视频教程

以上就是css如何设置内边距的详细内容，更多请关注其它相关文章！

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！