我们写css的时候经常会用到box-shadow这个属性,这个属性是盒子阴影,但是因为阴影扩散的原因,经常是四周都出现阴影,然后我们如果要只有一边有阴影的效果应该怎么做呢?
其实是解铃还须系铃人,我们需要对box-shadow其中的阴影半径做调整:x轴偏移值 y轴偏移值 模糊半径 阴影半径 || 颜色 insect,其中阴影半径可以为负值,意思是增加或减少指定数值的阴影半径
html & css
<style>
.box1{
margin:10px 50px;
width:100px;
height:100px;
border:1px solid grey;
display:inline-block;
}
.box1{
box-shadow: 5px 0px 5px -5px black;
}
</style>
</head>
<body>
<div class="box1">
</div>
</body>
效果
其中还有什么两边阴影,三边阴影呀,不过有了这个参考,其余我觉得就很简单了