html--盒子的边框属性（border）

 

content:内容框（我们设置的宽高是内容框的宽高）

padding:内边距 top  right  bottom left（四边--一般默认指定的方向）

border:边框线包裹了内边距（四边）

margin:外边距 在边框的外面 元素和其他元素的间隔距离（四边）

---

border:边框线包裹了内边距（四边）

属性名	属性值	用法
boder-style	solid(实线) dotted（点构成的虚线） dashed（-构成的虚线） double（双实线） none（没有边框线）	border-style:solid double solid double;（方向为从上边开始顺时针）
	border-style:solid double solid ;（上下的边框线为实线 右的边框线为双实线 下边框线为实线 左边框线为双实线  按照顺时针 最后一个左和右相同）	border-style:solid double ;（上下的边框线为实线 左右的边框线为双实线）

四边的表示分别为：

boder-top-style：solid(实线)

boder-right-style：solid(实线)

boder-bottom -style：solid(实线)

boder-left-style：solid(实线)

整体：：boder-style：solid(四个框全部实线) 

实际操作

	

	
content
	
大家
	
你好
	
世界

 

 边框线的宽度

属性名	属性值	用法
border-width	像素或者%或者thin（细）\medium(默认值)中\thick(粗)之一	border-width:2px;

	

	
content
	
大家
	
你好
	
世界
	
大家好
	
我
	

 

 边框线的颜色

属性名	属性值	用法
border-color	blue|rgb(25%,35%,45%)|#909090|transparent	border-color:red blue;

 

	

	
content
	
大家
	
你好
	
世界
	
大家好
	
我
	

---

使用border属性 一次性定义 边框的宽度 样式 颜色

border:1px solid red; 

	

	
content
	
大家
	
你好
	
世界
	
大家好
	
我
	
世界