今天小编跟大家讲解下有关css中如何设置投影？ ，相信小伙伴们对这个话题应该有所关注吧，小编也收集到了有关css中如何设置投影？ 的相关资料，希望小伙伴们看了有所帮助。
现在在页面中用到最多的是图片/容器投影，文字投影；那么css中如何设置投影？下面本篇文章就来给大家介绍一下使用css设置投影效果的方法，希望对大家有所帮助。
图片/容器投影
可以使用box-shadow属性来设置 图片/容器投影；box-shadow 属性向框添加一个或多个阴影。
语法
box-shadow: h-shadow v-shadow blur spread color inset;注释：box-shadow向框添加一个或多个阴影。该属性是由逗号分隔的阴影列表，每个阴影由 2-4 个长度值、可选的颜色值以及可选的inset关键词来规定。省略长度的值是 0。
属性值
h-shadow：必需。水平阴影的位置。允许负值。
v-shadow：必需。垂直阴影的位置。允许负值。
blur：可选。模糊距离。
spread：可选。阴影的尺寸。
color：可选。阴影的颜色。
inset：可选。将外部阴影 (outset) 改为内部阴影。
一般这样写box-shadow:1px 1px 5px #000;有4个值 分别指 水平方向偏移、垂直方向偏移、阴影羽化、投影颜色；
<div></div>.box1 {width: 500px;height: 400px;background: #7f0101;box-shadow: 10px 10px 5px #500606;box-shadow: <strong>inset</strong> 1px 1px 3px #f56a6a；}文字投影
可以使用text-shadow属性来设置文字投影；text-shadow 属性向文本设置阴影。
语法
text-shadow: h-shadow v-shadow blur color;注释：text-shadow 属性向文本添加一个或多个阴影。该属性是逗号分隔的阴影列表，每个阴影有两个或三个长度值和一个可选的颜色值进行规定。省略的长度是 0。
属性值：
h-shadow 必需。水平阴影的位置。允许负值。
v-shadow 必需。垂直阴影的位置。允许负值。
blur 可选。模糊的距离。
color 可选。阴影的颜色。
示例：
<h2>文字投影</h2>.tit{font-size: 50px;maring-top:20px;text-shadow:5px 5px 4px #000;}空心文字的效果，想必大家已经想到了吧：
.tit {font-size: 50px;maring-top: 20px;text-shadow: 0px 1px 0px #000;text-shadow: 0 1px #000, 0 -1px 0 #000, 1px 0 0 #000, -1px 0 0 #000;color: #fff;}来源：爱蒂网
