美文网首页
CSS 内边距 和边框

CSS 内边距 和边框

作者: 忆往昔Code | 来源:发表于2018-09-25 17:55 被阅读0次

    1 : element : 元素。

    padding : 内边距,也有资料将其翻译为填充。

    border : 边框。

    margin : 外边距,也有资料将其翻译为空白或空白边

    2:CSS 内边距 :元素的内边距在边框和内容区之间。控制该区域最简单的属性是 padding 属性。

    padding 属性接受长度值或百分比值,但不允许使用负值、

    h1 {padding: 10px;}

    h1 {padding: 10px 0.25em 2ex 20%;}---》上右下左

    padding-top

    padding-right

    padding-bottom

    padding-left

    td.test2 {padding: 0.5cm 2.5cm} 这个表格单元的上和下内边距是 0.5cm,左和右内边距是 2.5cm。

        B:CSS 边框

    1:定义单边样式

    如果您希望为元素框的某一个边设置边框样式,而不是设置所有 4 个边的边框样式,可以使用下面的单边边框样式属性:

    border-top-style

    border-right-style

    border-bottom-style

    border-left-style

    2:边框的宽度

    您可以通过 border-width 属性为边框指定宽度。

    3:定义单边宽度

    border-top-width

    border-right-width

    border-bottom-width

    border-left-width

    4:边框的颜色

    设置边框颜色非常简单。CSS 使用一个简单的 border-color 属性,它一次可以接受最多 4 个颜色值。

    定义单边颜色

    还有一些单边边框颜色属性。它们的原理与单边样式和宽度属性相同:

    border-top-color

    border-right-color

    border-bottom-color

    border-left-color

    5:透明边框:border-color: transparent;

    6:设置四边框样式

    p.dotted {border-style: dotted}

    p.dashed {border-style: dashed}

    p.solid {border-style: solid}

    p.double {border-style: double}

    p.groove {border-style: groove}

    p.ridge {border-style: ridge}

    p.inset {border-style: inset}

    p.outset {border-style: outset}

    CSS 边框属性

    属性描述

    border简写属性,用于把针对四个边的属性设置在一个声明。

    border-style用于设置元素所有边框的样式,或者单独地为各边设置边框样式。

    border-width简写属性,用于为元素的所有边框设置宽度,或者单独地为各边边框设置宽度。

    border-color简写属性,设置元素的所有边框中可见部分的颜色,或为 4 个边分别设置颜色。

    border-bottom简写属性,用于把下边框的所有属性设置到一个声明中。

    border-bottom-color设置元素的下边框的颜色。

    border-bottom-style设置元素的下边框的样式。

    border-bottom-width设置元素的下边框的宽度。

    border-left简写属性,用于把左边框的所有属性设置到一个声明中。

    border-left-color设置元素的左边框的颜色。

    border-left-style设置元素的左边框的样式。

    border-left-width设置元素的左边框的宽度。

    border-right简写属性,用于把右边框的所有属性设置到一个声明中。

    border-right-color设置元素的右边框的颜色。

    border-right-style设置元素的右边框的样式。

    border-right-width设置元素的右边框的宽度。

    border-top简写属性,用于把上边框的所有属性设置到一个声明中。

    border-top-color设置元素的上边框的颜色。

    border-top-style设置元素的上边框的样式。

    border-top-width设置元素的上边框的宽度。

    相关文章

      网友评论

          本文标题:CSS 内边距 和边框

          本文链接:https://www.haomeiwen.com/subject/ibegnftx.html