CSS边框与边界_html/css

1、CSS 边框属性

CSS边框属性允许你指定一个元素边框的样式和颜色。

1.1、边框样式

边框样式属性指定要显示什么样的边界。

border-style属性用来定义边框的样式

1.2、边框宽度

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

为边框指定宽度有两种方法：可以指定长度值，比如 2px 或 0.1em；或者使用 3 个关键字之一，它们分别是 thin 、medium（默认值） 和 thick。

注意：CSS 没有定义 3 个关键字的具体宽度，所以一个用户代理可能把 thin 、medium 和 thick 分别设置为等于 5px、3px 和 2px，而另一个用户代理则分别设置为 3px、2px 和1px。

1.3、边框颜色

border-color属性用于设置边框的颜色。可以设置的颜色：

name - 指定颜色的名称，如 "red"
RGB - 指定 RGB 值, 如 "rgb(255,0,0)"
Hex - 指定16进制值, 如 "#ff0000"

您还可以设置边框的颜色为"transparent"。

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

1.4、边框-简写属性

上面的例子用了很多属性来设置边框。

你可以在"border"属性中设置：

border-width
border-style (required)
border-color

2、CSS Padding(内边界)
CSS Padding（填充）属性定义元素边框与元素内容之间的空间。
当元素的 Padding（填充）（内边距）被清除时，所"释放"的区域将会受到元素背景颜色的填充。
单独使用填充属性可以改变上下左右的填充。缩写填充属性也可以使用，一旦改变一切都改变。

3、CSS Margin(外边距)
CSS Margin(外边距)属性定义元素周围的空间。
margin清除周围的元素（外边框）的区域。margin没有背景颜色，是完全透明的
margin可以单独改变元素的上，下，左，右边距。也可以一次改变所有的属性。

 
边框
 
内边界
 
外边界
 
1、边框border
 
border-style
border-color
border-width
 
 
2、边框方向设置
 
 border-color:red green blue orange; 
 
 
2.1、边框方向设置
 
 border-color:red green; 
 
 
2.2、边框方向设置
 
 border-color:red green blue; 
 
 
3、内边界
 
 
内边界
 
 
 
4、外边界
 
 
内边界