Code กรอบ (Table) หลายๆแบบ

 

 

<div style="border: 2px solid โค้ตสีกรอบ; overflow: auto; width: 450px; height: auto; text-align: center;" >ข้อความในกรอบ</div>

 

<div style="border: 2px dotted โค้ตสีกรอบ; overflow: auto; width: 450px; height: auto; text-align: center;" >ข้อความในกรอบ</div>

 

<div style="border: 2px dashed โค้ตสีกรอบ; overflow: auto; width: 450px; height: auto; text-align: center;" >ข้อความในกรอบ</div>

 

<div style="border: 2px groove โค้ตสีกรอบ; overflow: auto; width: 450px; height: auto; text-align: center;" >ข้อความในกรอบ</div>>

 

<div style="border: 2px ridge โค้ตสีกรอบ; overflow: auto; width: 450px; height: auto; text-align: center;" >ข้อความในกรอบ</div>

 

<div style="border: 2px inset โค้ตสีกรอบ; overflow: auto; width: 450px; height: auto; text-align: center;" >ข้อความในกรอบ</div>

 

<div style="border: 2px outset โค้ตสีกรอบ; overflow: auto; width: 450px; height: auto; text-align: center;" >ข้อความในกรอบ</div>

 

<div style="border: 2px double โค้ตสีกรอบ; overflow: auto; width: 450px; height: auto; text-align: center;" >ข้อความในกรอบ</div>

 

1.ใช้สีเป็นพื้นหลัง ไม่มีกรอบ

<div style="border: medium none; background: โค้ตสี บีจี none repeat scroll 0% 0%; width: 450px; height: auto; text-align: center;">ข้อความของท่าน </div>

 

2.ใช้รูปเป็นพื้นหลัง ไม่มีกรอบ

<div style="border: medium none; overflow: auto; background-image: url(URL บีจีที่ต้องการ); width: 450px; height: auto; text-align: center;" >ข้อความในกรอบ</div>

 

3.พื้นหลังใส มีสีเป็นกรอบ 1 เส้น

<div style="border: 3px solid โค้ตสีกรอบ; background: transparent none repeat scroll 0% 0%; overflow: auto; width: 450px; height: auto; text-align: center;">ข้อความในกรอบ </div>

 

4.ใช้สีเป็นพื้นหลัง มีสีเป็นกรอบ 1 เส้น

<div style="border: 3px solid โค้ตสีกรอบ; background: โค้ตสี บีจี none repeat scroll 0% 0%; width: 450px; height: auto; text-align: center;" >ข้อความของท่านค่ะ</div>