我尝试在字体真棒集的星星上应用两个阴影:http://jsfiddle.net/myYUh/117/
这部分有问题:
text-shadow: 2px 2px 2px #190C80;
text-shadow: -2px -2px 2px #190C80;
阴影只是左上角,因此只显示一个阴影,即使我在一行中尝试这个,出了什么问题?
答案 0 :(得分:4)
要添加多个阴影,请将它们合并,并与,
text-shadow: 2px 2px 2px #190C80, -2px -2px 2px #190C80;
这适用于CSS中的所有阴影。
小教程: http://www.paulund.co.uk/creating-different-css3-box-shadows-effects
答案 1 :(得分:3)
你用第二个阴影覆盖了第一个阴影。
如果您想要多个阴影,请使用逗号设置它们:
text-shadow: 2px 2px 2px #190C80,
-2px -2px 2px #190C80;
@import url("http://netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css");
@import url("http://netdna.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css");
.rating {
unicode-bidi: bidi-override;
direction: rtl;
font-size: 30px;
}
.rating span.star {
margin: 0px;
padding: 0px;
font-family: FontAwesome;
font-weight: normal;
font-style: normal;
display: inline-block;
text-shadow: 2px 2px 2px #190C80,
-2px -2px 2px #190C80;
}
.rating span.star:hover {
cursor: pointer;
}
.rating span.star:before {
content: "\f005";
padding-right: 5px;
color: #777777;
}
.rating span.star:hover:before,
.rating span.star:hover ~ span.star:before {
content: "\f005";
color: yellow;
}
<p class="evaluation_technique">
<span class="rating">
<span class="star"></span>
<span class="star"></span>
<span class="star"></span>
<span class="star"></span>
<span class="star"></span>
</span>
</p>
spec:
中对此进行了解释<强>
text-shadow
强>此属性接受以逗号分隔的阴影效果列表 应用于元素的文本。