เทคนิคการสร้างตารางแบบจุดไข่ปลา จัดทำโดย : 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 ดูว่าได้ผลตามที่เราต้องการหรือไม่ ขอให้สนุกกับการทำเว็บ

 

คุณอาจสนใจ
การทำ Magic Wand วิ่งตามเมาส์
Mr.GuruZ (54,234 - 04 มิ.ย. 49)
การส่งออกเข้า Ms Excel อย่างง่ายๆ
first (37,442 - 23 ธ.ค. 50)
นําเนื้อหาจาก Ms Word เข้า Dreamweaver
webthaidd (61,541 - 12 มี.ค. 51)
ความแตกระหว่างการใช้งาน break; และ exit();
เฟริท (32,814 - 22 พ.ย. 50)
การใช้คำสั่งวนลูป while
Mr.GuruZ (31,325 - 03 มิ.ย. 49)
การ Import File
Mr.Mean (48,764 - 04 มิ.ย. 49)
การใช้งาน PowerPoint โดยเลือกใช้รูปแบบ Blank presentation
หมูขุน (15,072 - 04 ก.พ. 50)
การใช้คำสั่ง DMax และ DMin
นายจืด (19,162 - 08 พ.ค. 51)