เทคนิคการสร้างตารางแบบจุดไข่ปลา จัดทำโดย : Mr.GuruZ พิมพ์
 Untitled Document

เทคนิคการสร้างตารางแบบจุดไข่ปลา  หลายๆ ครั้งเห็นบางคนถามว่าเราจะสร้างได้อย่างไร หรือต้องใส่ background หรือเปล่า คิดไปคิดมาปวดหัว มาดูวิธีการสร้างแบบนี้ดีกว่าง่ายเพียงปลายนิ้ว เทคนิคนี้เราจะนำ CSS Style มาประยุกต์ใช้เข้ากับตาราง มาดูขั้นตอนการทำ

ขั้นตอนการทำ
1. อันดับแรกแน่นอนคุณจะต้องสร้างตารางขึ้นมาก่อน ตามขนาดที่คุณต้องการ แต่รูปแบบให้กำหนดดังภาพตัวอย่าง หลังจากที่เรากด ok แล้วเราจะได้ตารางขึ้นมา แบบไม่มีเส้นขอบ และระยะห่างของขอบ

2. หลังจากนั้นเรามาสร้าง CSS Style แบบจุดไข่ปลา เพื่อนำไปใช้กับตารางอีกที โดยลำดับ ตามภาพ





3. สร้างกันได้ไหมเอ่ย ถ้าไม่ได้ก็นำโค้ดนี้ไปวางที่ Head ได้เลย

<style type="text/css">
<!--
.border {
border: 1px dotted #000000;
}
-->
</style>

4. ถ้าสร้างได้แล้ว เราก็นำ CSS Style มาใส่ที่ตาราง โดยให้เราคลิดขวาที่ตารางแล้วเลือก Css ที่เราสร้างได้เลย

5. หลังจากนั้นก็ลอง Preview ดูว่าได้ผลตามที่เราต้องการหรือไม่ ขอให้สนุกกับการทำเว็บ

 

คุณอาจสนใจ
การใช้คำสั่ง while
Mr.POP (38,490 - 05 พ.ย. 49)
การทำ List/Menu ด้วย Ajax
first (74,391 - 19 ก.พ. 51)
เก็บไฟล์ Flash จากเว็บเพจง่ายๆ ด้วย Flash Catcher 2.6 (ตอนที่่่ 2)
บุญชัย แซ่เฮ้ง : axixa111hotmail.com (40,646 - 29 ก.ย. 50)
การสร้าง Barcode
langjuko (172,297 - 08 ต.ค. 51)
คำถามยอดฮิตเร่งสปีดบรอดแบนด์
เว็บไทยดีดี (14,744 - 22 ก.ย. 50)
สร้างข้อความแบบ wave
langjuko (45,088 - 02 ก.ย. 51)
สรุปคำสั่ง Action Script บน Flash MX (ตอนที่ 4)
สหรัถ แซ่ตั้ง (26,489 - 08 ก.ย. 50)
การใช้งาน Renden แบบ Mental Ray
first (21,095 - 03 พ.ค. 51)