boxshadow-box-shadow参数
box-shadow最少为两个参数:即h-shadow和v-shadow,大家可以理解为x和y轴的概念。
向元素添加单个 box-shadow 效果时使用以下规则:
当给出两个、三个或四个 值时。
如果只给出两个值, 那么这两个值将会被当作 来解释。
如果给出了第三个值, 那么第三个值将会被当作解释。
如果给出了第四个值, 那么第四个值将会被当作来解释。
可选,inset关键字。
可选,值。
属性实例
img{ box-shadow:10px 10px}
这里只设置了必须的两个参数,设置阴影为10px,没有背景色则默认为黑色,注意这两个参数如果设置为负数,则是相反的方向出现阴影,如下:img{ box- shadow: -10px, -10px}
blur参数此参数用来设置模糊距离,不能为负数。
img{ box-shadow: -10px -10px 20px; }/ /设置blur为20px :
color参数此参数设置阴影的颜色。
img{ box-shadow:-10px -10px 20px 20px gold;}
inset参数如果想要全部边缘都要阴影元素,直接把x和y设置为0即可。
div{ box-shadow:0px 0px 20px 10px green;}
关键词: boxshadow boxshadow四个值的意思 boxshadow内部阴影 box shadow属性 盒子阴影boxshadow boxshadow单边阴影 boxshadow属性值顺序 boxshadow属性值 boxshadow四周阴影 boxshadow的4个属性值 boxshadow四个边阴影
相关阅读
最近更新
- 06-14
- 06-14
- 06-14
- 06-13