css中box-shadow的用法總結
阿新 • • 發佈:2019-02-11
閒來無事,整理下資料夾,發現一個很久前的box-shadow資料夾,現在就總結下box-shadow的用法。
.top-right{ width: 150px; height: 80px; background-color: green; box-shadow: 4px 4px 4px salmon; } .top{ width: 150px; height: 80px; background-color: green; box-shadow: 0px -4px 4px salmon; } .left{ width: 150px; height: 80px; background-color: green; box-shadow: -4px 0px 4px salmon; } .range{ width: 150px; height: 80px; background-color: green; box-shadow: 4px 4px 4px salmon,-4px 0px 4px salmon,0px -4px 4px salmon; }
<div class="con">
<p class="top-right">box-shadow:</br>正值 正值 陰影 顏色</p>
<p class="top">box-shadow:</br>0 負值 陰影 顏色</p>
<p class="left">box-shadow:</br>0 負值 陰影 顏色</p>
<p class="range">box-shadow:</br>0 負值 陰影 顏色</p>
</div>