Wil*_*ner 367 css underline box-shadow
我该怎么做呢？我希望我的元素看起来好像有一个阴影下划线.我不想要其他三面的影子
小智 785
做这个:
box-shadow: 0 4px 2px -2px gray;
它实际上要简单得多,无论你将模糊设置为(第三个值),将展开(第四个值)设置为它的负数.
Yi *_*ang 49
你可以使用两个元素,一个在另一个内部,并给出外部overflow: hidden元素和宽度等于内部元素以及底部填充,以便所有其他边上的阴影被"切断"
#outer {
width: 100px;
overflow: hidden;
padding-bottom: 10px;
}
#outer > div {
width: 100px;
height: 100px;
background: orange;
-moz-box-shadow: 0 4px 4px rgba(0, 0, 0, 0.4);
-webkit-box-shadow: 0 4px 4px rgba(0, 0, 0, 0.4);
box-shadow: 0 4px 4px rgba(0, 0, 0, 0.4);
}
或者,浮动外部元素以使其缩小到内部元素的大小.请参阅:http://jsfiddle.net/QJPd5/1/
Ner*_*kat 23
试试这个
-moz-box-shadow:0 5px 5px rgba(182, 182, 182, 0.75);
-webkit-box-shadow: 0 5px 5px rgba(182, 182, 182, 0.75);
box-shadow: 0 5px 5px rgba(182, 182, 182, 0.75);
你可以在http://jsfiddle.net/wJ7qp/看到它
小智 11
尝试这样可以完全控制盒子阴影.
<html>
<head>
<style>
div {
width:300px;
height:100px;
background-color:yellow;
box-shadow: 0 10px black inset,0 -10px red inset, -10px 0 blue inset, 10px 0 green inset;
}
</style>
</head>
<body>
<div>
</div>
</body>
</html>
这也适用于外框阴影.