css border阴影,css改变透明度

一、关于透明度 background-color：hsla（0,23%,56%,1）； opacity 设置透明度，只能针对整个盒子设置透明度子盒子会继承父盒子的透明度
.out{ width: 200px; height: 200px; background: green; border: 1px solid darkgreen; margin: 40px auto; opacity: 0.3; }
子盒子也出现透明
.out .inner{ width: 100px; height: 100px; background-color: yellow; }background-color: transparent; 完全透明，不可调节透明度使用rgba 来控制颜色，相对opacity ，不具有继承性 二、文本 (shadow 阴影)

text-shadow，可分别设置偏移量、模糊度、颜色（可设透明度）
例如：

text-shadow: 5px 5px 2px #ccc;

属性值介绍：

水平偏移量 正值向右 负值向左垂直偏移量 正值向下 负值向上模糊度不能为负值设置对象阴影的颜色

详细介绍如下：

5px 水平偏移量. 正值向右 负值向左
5px 水垂直偏移量. 正值向下 负值向上
2px 模糊度 模糊度不能为负值 值越大越模糊
#ccc 设置对象阴影的颜色. 可以有多个影子

三、圆角边框（border-radius属性）

border-radius属性，属性值是圆角的半径，半径越大，圆角的程度越大

方法如下:

boder-top-left-radius：30px； //左上角boder-top-right-radius：30px； //右上角boder-bottom-left-radius：30px； //右下角boder-bottom-right-radius：30px； //左下角

如果这四个弧度的圆角相同，可以写成：border-radius：30px；
border-radius：赋值的数量可以设置很多种不同的

一个参数就是上边的四个圆角弧度相同：border-radius：30px；两个参数则第一个参数作为左上角,右下角圆角半径,第二个作为右上,坐下圆角半径：border-radius：30px 20px；三个参数分别是 左上 / 右上+左下 / 右下 角的圆角半径：border-radius：30px 20px 10px;四个参数的顺序是左上 / 右上/ 右下 / 左下 的圆角半径(从左上开始顺时针)：border-radius： 40px 30px 20px 10px ;