css相关基础

border边框

border => 边框线

border:粗细 样式 颜色

粗细 => px

样式 => solid => 实线

dashed => 虚线

double => 双实线

dotted => 点状虚线

border-width：边框宽度  单位px;

border-style：边框样式

solid 默认，实线

double 双线

dotted 点状线条

dashed 虚线

border-color：边框颜色

border: 简写

border: 2px yellow solid;

border-left:粗细 样式 颜色 => 左边框线

border-right:粗细 样式 颜色  => 右边框线

border-top:粗细 样式 颜色  => 上边框线

border-bottom:粗细 样式 颜色  => 下边框线

2.圆角边框

border-radius：圆角

1个参数：四个角都应用

2个参数：第一个参数应用于 左上、右下；第二个参数应用于 左下、右上

3个参数：第一个参数应用于 左上；第二个参数应用于 左下、右上；第三个参数应用于右下

4个参数：左上、右上、右下、左下（顺时针）

 

3.边框阴影

box-shadow：边框阴影

第一个参数是左右位置

第二个参数是上下位置

第三个参数是虚化效果

第四个参数是颜色

box-shadow: 10px 10px 5px #888;

•  outline 边框轮廓

• outline-width 轮廓宽度
• outline-color 轮廓颜色
• outline-style 轮廓样式