[分享]css3文字与边框的距离

CSS3是一种常用的样式语言，它不仅可以实现丰富多彩的效果，还可以控制文字与边框之间的距离。 / 设置文字与边框的距离 / div { padding: 10px; border: 1px solid...

CSS3是一种常用的样式语言，它不仅可以实现丰富多彩的效果，还可以控制文字与边框之间的距离。

 /* 设置文字与边框的距离 */
    div {
        padding: 10px;
        border: 1px solid black;
        margin: 10px;
    }

    /* 只设置上下边距为10px，左右边距为0 */
    p {
        margin-top: 10px;
        margin-bottom: 10px;
        margin-left: 0;
        margin-right: 0;
    } 

如上代码所示，可以通过设置padding、border和margin属性来控制元素的内边距、边框和外边距。当需要控制文字与边框之间的距离时，可以设置p标签的margin属性来实现。

需要注意的是，margin属性包括四个属性值，分别是上下左右边距。所以当只需要设置上下边距时，需要指定margin-top和margin-bottom的值，而将margin-left和margin-right的值设为0。

除了使用margin属性外，还可以使用padding属性来控制文字与边框的距离。和margin相似，padding也包括四个属性值，分别是上下左右内边距。当需要控制文字与边框之间的距离时，可以设置p标签的padding属性来实现。

综上所述，通过设置margin和padding属性，可以轻松控制文字与边框之间的距离，从而实现更好的样式效果。