Day02(css3边框,demo 聊天框)

2017-11-07  本文已影响0人  AnnQi

css3 边框

1.1边框圆角

border-radius

圆角在处理的时候,要有一个概念,要形成一个圆,圆心、长半径、短半径的一个概念,正圆其实是椭圆的一种特殊情况;

在我们设置的时候,可以分别设置长半径,短半径,用“/”分割,遵循1,2,3,4,的四个角的规则
当圆角半径小于或等于边框宽度的时候,元素内角为直角

1.2边框图片
image.png

我们给边框设置背景图片,会被切割成九宫格的形式,然后设置
通过我们的背景切割,把背景图切割下来,放在我们的边框上面

1.3边框阴影
box-shadow:水平偏移,垂直偏移,模糊度,颜色

偏移量可以加上符号,但是符号仅仅只是改变方向,不改变数值;
例如:boxshadow:10px 0 0 0 ;水平往右偏移10像素
但是,加上负号:box-shadow:-10px 0 0 0 ;水平往左偏移10像素
也就是我们的负号只改变方向,不改变数值;
偏移可以设置负,模糊度不能设置负
偏移量和模糊度是相加计算,符号不影响计算结果

模糊度:就是指一个颜色渐变至透明的过程,就叫做模糊度
上一篇下一篇

猜你喜欢

热点阅读