CSS基础知识,CSS阴影及圆角边框
2023-01-25 18:50:31
24
CSS基础知识之CSS阴影及圆角边框
一、CSS阴影（box-shadow）
语法box-shadow:h-shadow v-shadow blur spread color inset;
默认为外阴影(outset)，但是不可以写这个单词，否则无效
盒子阴影不占用空间，不会影响其他盒子排列
鼠标经过div为div:hover {box-shadow: 10px 10px;}
2.文字阴影（text-shadow）
语法text-shadow：h-shadow v-shadow blur color
二、圆角边框（border-radius）
语法border-radius：length;
语法border-radius：length;
半径原理：圆与边框的交集形成圆角效果
参数值可以为数值或百分比形式
若为正方形，想设置为圆，把数值改为高/宽的一半，或直接写为50%
若为矩形，设为高的一半即可
分开写：border-top-left-radius | border-top-right-radiusborder-bottom-left-radius | border-bottom-right-radius
该属性是一个简写属性，可以跟四个值，分别代表左上角，右上角，右下角，左下角
专业