先看效果图：

盒子内阴影和文字内阴影-QUI-Notes

是不是很漂亮，这就要使用css的内阴影属性了。很简单，下面我们就去揭开它的面纱：

盒子内阴影CSS： 

box-shadow: inset 8px 8px 16px #90bac7,inset -8px -8px 12px #c3f0ff;

当然，需要设置背景色，阴影色要与背景色接近。以下是案例的css:

body {
			background: #ADD8E6;
		}
		
.box {
			border-radius: 50%;
			width: 300px;
			height: 300px;
			line-height: 300px;
			margin: 150px auto 0 auto;
			text-align: center;
			background: #ADD8E6;
			box-shadow: inset 8px 8px 16px #90bac7, inset -8px -8px 12px #c3f0ff; 
		}

是不是很简单？

那么文字内阴影呢？不能再用box-shadow了，那样背景一块色，只能用text-shadow 

text-shadow: 2px 2px 0px #90bac7, -1px -1px 0px #c3f0ff

以下为案例css: 

.box span {
			font-size: 40px;
			color: #ADD8E6;
			text-shadow: 2px 2px 0px #90bac7, -1px -1px 0px #c3f0ff
		}