วิธีการรวมหรือผสานเซลล์ในตาราง HTML

คุณสามารถรวมเซลล์ตารางตั้งแต่สองเซลล์ขึ้นไปเข้าด้วยกันโดยใช้แอตทริบิวต์ colspan ใน แท็ก HTML (ข้อมูลตาราง) ตัวอย่างเช่นในรหัสด้านล่างเป็นตารางที่มีสามแถวและสามคอลัมน์

หากเราต้องการรวมสองเซลล์แรกเข้าเป็นเซลล์เดียวเราสามารถใช้แอตทริบิวต์ colspan = "2" ในครั้งแรก แท็ก ตัวเลขแสดงจำนวนเซลล์ที่คุณต้องการใช้สำหรับ แท็ก

ตัวอย่างตาราง HTML

โค้ดด้านบนแสดงในเว็บเบราว์เซอร์สร้างตารางคล้ายกับตารางที่แสดงด้านล่าง อย่างที่คุณเห็นเซลล์แรกขยายความกว้างของสองคอลัมน์

หากต้องการใช้ทั้งสามเซลล์ที่ด้านบนของตารางให้เพิ่มค่า colspan เป็น 3 เนื่องจากมีสามคอลัมน์ การเพิ่มค่าเป็น 3 จะช่วยให้คุณมีตารางคล้ายกับตัวอย่างที่แสดงด้านล่าง

หมายเหตุ: ตรวจสอบให้แน่ใจว่าเมื่อคุณขยาย คอลัมน์ที่คุณลบที่เหลืออยู่ แท็ก ในตัวอย่างด้านบนเนื่องจากเราใช้ทั้งสามคอลัมน์เรามีเพียงหนึ่งคอลัมน์เท่านั้น ใน (แถวของตาราง)

การผสานเซลล์โดยใช้เครื่องมือแก้ไขแบบ WYSIWYG

คุณยังสามารถใช้เครื่องมือแก้ไขแบบ WYSIWYG เพื่อรวมเซลล์ โดยทั่วไปจะทำโดยเน้นสองเซลล์ขึ้นไปคลิกขวาที่เซลล์แล้วเลือกตัวเลือกเพื่อรวมเซลล์ ด้านล่างเป็นขั้นตอนเพิ่มเติมเกี่ยวกับวิธีการทำเช่นนี้ใน Dreamweaver และ Expression Web

ผสานเซลล์โดยใช้ Dreamweaver

  1. ไฮไลต์เซลล์อย่างน้อยสองเซลล์ในตารางของคุณ
  2. คลิกขวาที่เซลล์ที่ไฮไลต์
  3. คลิกที่ ตาราง จากนั้น ผสานเซลล์

หรือ

  1. ไฮไลต์เซลล์อย่างน้อยสองเซลล์ในตารางของคุณ
  2. กดแป้นพิมพ์ลัด Alt + Ctrl + M

การผสานเซลล์โดยใช้ Expression Web

  1. ไฮไลต์เซลล์อย่างน้อยสองเซลล์ในตารางของคุณ
  2. คลิกขวาที่เซลล์ที่ไฮไลต์
  3. คลิก ปรับเปลี่ยน แล้ว รวมเซลล์