只有box-shadow Inset bottom有问题 [英] Have an issue with box-shadow Inset bottom only
本文介绍了只有box-shadow Inset bottom有问题的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我使用box-shadow创建一个内部阴影...
I am using box-shadow to create an inner shadow...
box-shadow: inset 0 0 10px #000000;
-moz-box-shadow: inset 0 0 10px #000000;
-webkit-box-shadow: inset 0 0 10px #000000;
...但是希望内部阴影从底部进入。
...but would like the inner shadow to come in from the bottom only. I have tried several ways of trying to make this work but can't... How would I do this with box-shadow?
推荐答案
我已经尝试过几种尝试使这项工作，但不能...的方法。
对定义了展开距离的第四个长度使用负值。这通常被忽视，但所有主要浏览器都支持。请参阅此小提示结果。
Use a negative value for the fourth length which defines the spread distance. This is often overlooked, but supported by all major browsers. See this Fiddle for the result.
div{
background:red;
height:100px;
width:200px;
-moz-box-shadow: inset 0 -10px 10px -10px #000000;
-webkit-box-shadow: inset 0 -10px 10px -10px #000000;
box-shadow: inset 0 -10px 10px -10px #000000;
}
<!doctype html>
<div></div>
这篇关于只有box-shadow Inset bottom有问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
