css3 阴影、图片边框、边框大小
css3颜色
-
十六进制颜色
-
#ffffff 十六进制0-f 两位一色,分别为红、绿、蓝
-
RGB颜色
-
rgb(红,绿,蓝) 0-255
-
RGBA颜色
-
rgba(红,绿,蓝, alpha) alpha为透明度,取值0-1
-
hls颜色
-
hsl(h,s,l) 色相饱和度设置颜色 h:色调(0-360)0表示红色 120绿色 240蓝色 s:饱和度0-100% l:亮度 0-100%
-
hsla颜色
-
最后一个属性alpha为透明度,取值0-1
css3 文本效果
-
CSS3 文本阴影
-
text-shadow(水平阴影,垂直阴影,模糊的距离,阴影的颜色)
-
CSS3 文本溢出省略号
-
文本不换行 white-space: nowrap;
-
多余的部分隐藏掉 overflow: hidden;
-
修剪文本 text-overflow: clip;
css3 边框
-
圆角
-
border-radius:25px;四个角圆角
-
border-radius:50%;若是正方形,则为圆
-
border-radius:25px 20px 15px 10px;左上、右上、右下、左下
-
边框图片
-
border: 30px solid blue;
-
border-image:url(border.png) 30 30 round;
-
repeat平铺 stretch拉伸 round填充
-
中间两个数是规定图像边框的向内偏移(宽度)
-
盒子阴影
-
box-shadow:(水平阴影,垂直阴影,模糊的距离,阴影的颜色);
CSS3框大小 box-sizing
-
box-sizing 属性允许你以某种方式定义某些元素,以适应指定区域。(添加在父元素)
-
box-sizing:border-box; 确定盒子大小,包括内边距和边框,自适应宽和高。
-
box-sizing:content-box; 确定盒子大小,包括边框,自适应宽和高。
-
resize 属性指定一个元素是否应该由用户去调整大小 horizontal 水平可调节 vertical垂直 both水平垂直均可