css3中的inset什么意思,起什么作用,如何使用?

html-css034

css3中的inset什么意思,起什么作用,如何使用?,第1张

CSS3 内阴影(inset)代码:

.shadow {

-moz-box-shadow:inset 0 0 10px #000000

-webkit-box-shadow:inset 0 0 10px #000000

box-shadow:inset 0 0 10px #000000

}

CSS3 box-shadow 代码说明

inset 0 0 10px #000000含义如下

1. inset: 内投影

2. 水平方向偏移量

3. 垂直方向偏移量

4. 模糊半径值

div{

box-shadow: 0px 0px 10px rgba(0,0,0,0.8) inset,0px 0px 5px rgba(200,200,200,0.5)

width:300px

height:400px

margin:40px auto

background-color: rgba(66,66,66,0.2)

border-radius:4px

border:2px solid rgba(70,70,70,1)

}

用 , 号并在一行

text-shadow是给文本添加阴影效果,box-shadow是给元素块添加周边阴影效果。

基本语法是{box-shadow:[inset] x-offset y-offset blur-radius spread-radiuscolor}

对象选择器 {box-shadow:[投影方式] X轴偏移量 Y轴偏移量阴影模糊半径 阴影扩展半径 阴影颜色}

直接按照上面设置参数就可以实现,希望对你有帮助,望采纳!