边框

首页 > 边框

本页面正在施工中！您也可 点击此处 协助编辑，感谢各位对wiki的贡献。

×

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	设置元素的上边框的宽度。
border-radius	设置圆角的边框。

border-color

边框颜色

用于设置边框的颜色。可以设置的颜色是通过CSS最经常的指定：

十六进制值（标准） - 如: #FF0000
十六进制值（简写） - 如: #F00
十六进制值（透明度） - 如: #FF000000
一个RGB值 - 如: rgb(255 0 0)
一个RGBA值（透明度） - 如: rgb(255 0 0 / 50%)
颜色的名称 - 如: red
您还可以设置边框的颜色为"transparent"。

注意： border-color单独使用是不起作用的，必须得先使用border-style来设置边框样式。

参阅 CSS颜色值查看完整的颜色值。

一个网页的文本颜色是指在主体内的选择：

实例

<div style="border: 1px solid #ccc!important;border-color: #000!important;padding: 14px;">
<p>在四边都有边框</p>
</div>
<div style="border-bottom: 1px solid #ccc!important;padding:14px;border-color: #f44336!important;">
<p>红色底部边框</p>
</div>
<div style="border: 1px solid #ccc!important;padding:14px;border-radius: 16px!important;">
<p>圆角边框</p>
</div>
<div style="background-color: #ddffff!important;padding: 14px;border-left: 6px solid #ccc!important;border-color: #2196F3!important;">
<p>左侧边框带宽度，颜色为蓝色</p>
</div>

效果

在四边都有边框

红色底部边框

圆角边框

左侧边框带宽度，颜色为蓝色

尝试一下 »