การแทรกตาราง
สวัสดีเพื่อนๆ ชาวบล็อกเกอร์ทุกคนนะคร้าบ วันนี้ผมจะมาอัพเดตข้อมูลเกี่ยวกับแท็ก HTML กันต่อนะครับ ในบทความนี้เรามาพูดถึงเรื่องการแทรกตารางกันดีกว่าครับ
- การสร้างตาราง
จะใช้แท็ก <table>...</table> เพื่อสร้างตารางขึ้นมา โดยจัดเป็นแท็กคู่
<tr>...</tr> เพื่อแสดงว่าข้อมูลนั้นอยู่ในแถวเดียวกัน
และ <td>...</td> เพื่อแสดงว่าข้อมูลนั้นอยู่ในเซลล์หรือช่องเดียวกัน
สามารถแสดงได้ดังนี้
จากรูปจะเห็นว่าไม่มีตารางปรากฏขึ้นมา ไม่ได้หมายความว่าพิมพ์ผิดหรือตกแต่อย่างใด แต่ตารางนี้ไม่มีความหนา ดังนั้นจึงต้องเพิ่มความหนาให้ โดยการเติม border=x (เมื่อ x มีค่าความหนาตั้งแต่ 0 เป็นต้นไป ยิ่งเลขมาก ยิ่งหนามาก) ทำได้ดังนี้
แต่ถ้าเราอยากให้ให้เส้นขอบมีสีสันขึ้นมา ต้องเพิ่ม bordercolor="x" โดย x เป็นชื่อสี หรือโค้ดสี 6 หลัก ซึ่งการกำหนดสีแบบโค้ดจะให้สีที่ละเอียดกว่าการระบุชื่อสีไปเลย ดังนี้
- การปรับแต่งตารางเบื้องต้น (เพิ่มที่แท็ก<table>)
width=x แท็กนี้สามารถกำหนดความกว้างของตารางเป็น % หรือ ตัวเลข(มีหน่วยเป็นพิกเซล)
height=x โดยที่ x จะกำหนดความสูงของตารางนั้น สามารถกำหนดเป็น % หรือตัวเลข(หน่วยเป็นพิกเซล) เช่นเดียวกับความกว้าง ดังตัวอย่างต่อไปนี้
colspan=x ไว้ใช้กำหนดจำนวนคอลัมน์ที่อยากจะรวมเข้าด้วยกันเป็นเซลล์เดียว ดังแสดง
rowspan=x เมื่อต้องการจะรวมแถวเข้ากันเป็นเซลล์เดียว โดย x เป็นจำนวนที่ต้องการ ดังนี้
เอาล่ะครับ วันนี้พอแค่นี้ก่อน ไว้คราวหน้าเรามาพบกันใหม่นะครับ สำหรับคนที่อยากเรียนรู้เพิ่มเติมก็สามารถเข้าไปในลิงค์เว็บที่อยู่ด้านล่างได้นะครับ ไปแล้วคร้าบ
ลงวันที่ 27 ส.ค. 2555
