ลองทำเงาขอบบนแบบง่าย ๆ เพื่อทำให้หน้าเว็บดูมีมิติดีขึ้น

เนื้อไฟล์ css

<style>
.test {width: 250px; border: solid 1px #c00; float: left; margin: 10px;}

b.sh1 {display: block; margin:0; height: 1px; background: #ddd;}
b.sh2 {display: block; margin:0; height: 2px; background: #eee;}
b.sh3 {display: block; margin:0; height: 4px; background: #f8f8f8;}
</style>

เนื้อไฟล์ html

<div class="test">
<br />
<br />
แบบไม่มีเงา
</div>

<div class="test">
<b class="sh1"></b><b class="sh2"></b><b class="sh3"></b>
แบบมีเงา
</div>