กรอบรูปสวยๆ ด้วย CSS

แบบที่ 1 เป็นกรอบสี และมีพื้นเป็นรูป

<style type="text/css">

div.frame1 {

  border:1px solid navy;

  padding:5px;

  background-image:url(f_t.jpg);

}

</style>

<div class="frame1">

  <img alt="" width="70" height="70" src="/datas/users/goro/image/8T1CRY8DQS.jpg" /></div>

</div>

แบบที่ 2 เป็นกรอบสีเช่นกัน แต่พื้นเป็นสีครับ

<style type="text/css">

div.frame2 {

  border:1px solid black;

  padding:5px;

  background-color:#F3E3D9;

}

</style>

แบบที่ 3 กรอบสีอีกแบบหนึ่ง

<style type="text/css">

div.frame3 {

  border:5px solid #F3E3D9;

  padding:1px;

  background-color:black;

}

</style>

แบบที่ 4 กรอบ 2 ชั้น สลับสีกัน

<style type="text/css">

div.frame4_1 {

  border:3px solid #F3E3D9;

  padding:1px;

  background-color:black;

}

div.frame4_2 {

  padding:2px;

  background-color:white;

}

</style>

<div class="frame4_1">

  <div class="frame4_2">

    <img alt="" width="70" height="70" src="/datas/users/goro/image/1WCPKKRN1G.jpg" />

  </div>

</div>