css3中的inset什么意思，起什么作用，如何使用？

html-css04

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. 模糊半径值

用CSS做图层的投影效果,css2是做不到的，在css3中，我们可以通过box-shadow 内阴影与外阴影来实现，用法是，E {box-shadow:inset x-offset y-offset blur-radius spread-radius color}，对象选择器 {text-shadow:投影方式 X轴偏移量 Y轴偏移量 阴影模糊半径 阴影扩展半径 阴影颜色}；这里我们通过代码来理解：

<html>

<head>

<style>

#nav{

width:900px

height:30px

-moz-box-shadow:5px 5px 5px #999 inset           

-webkit-box-shadow:5px 5px 5px #999 inset       

box-shadow:5px 5px 5px #999 inset

}

</head>

<body>

<div class="nav" >

</div>

     

</body>

</html>

效果如图：