CSS新手入门笔记整理：CSS边框样式

边框宽度：boder-width

语法

boder-width:像素值；

边框样式：boder-style

语法

boder-style:取值；

边框颜色：boder-color

语法

boder-color:色值；

简写形式

语法

边框：宽度值 样式值 颜色值

boder:1px solid red；

局部样式

• 上边框：border-top
• 左边框：border-left
• 右边框：border-right
• 下边框：border-bottom

边框圆角： border-radius

语法

元素{border-radius:取值;}

border-radius 属性取值是一个长度值，单位可以是 px、em 和百分比等。

border-radius的四个取值

/*设置 1 个值,表示 4 个角的圆角半径都是 10px*/
border-radius:10px;
/*设置 2 个值,表示左上角和右下角的圆角半径都是 10px，右上角和左下角的圆角半径都是 20px。*/
border-radius:10px 20px
/*设置 3 个值,表示左上角的圆角半径是 10px，左下角和右上角的圆角半径都是 20px，右下角的是30px*/
border-radius:10px 20px 30px;
/*设置 4 个值,表示左上角、右上角、右下角和左下角的圆角半径依次是 10px、20px、30px、40px*/
border-radius:10px 20px 30px 40px;