การใช้งาน Lay out และ Table

ในเมนูปรกติที่ Tab ด้านบนจะไม่มีแท็บ ‘”Layout” ซึ่งมีต่อจากแท็บ Develp แสดงให้เห็น
ดังแสดงในรูปที่ 1

รูปที่ 1

จะต้องคลิกไปที่ปุ่มตาราง (Table) และกำหนดจำนวน Column และ Low ก่อน ดังรูปที่ 2 จึงจะพบแท็บ Layout ในรูปที่ 3

รูปที่ 2

จาก นั้นจะพบปุ่ม Layout เพิ่มเข้ามา ให้เราคลิกไปที่ปุ่ม Layout นี้ บริเวณ Ribbon ก็จะแสดงเครื่องมือต่างๆที่จัดการเกี่ยวกับตารางแสดงให้เห็นดังรูปที่ 3

รูปที่ 3

ตอนนี้ลองเลือกใช้ Split cell ดังรูปที่ 4 ซึ่งเมื่อเราลองเลือกให้แยกเป็น 2 แถว ก็จะได้ดังรูปที่ 5 ซึ่งอัน
ที่จริงก็มีเครื่องมือครบที่เกี่ยวกับการจัดการตารางไม่ว่าจะเป็นเพิ่มหรือลดจำนวนคอลัมน์หรือแถว
ลองฝึกทำดูครับ

รูปที่ 4

รูปที่ 5

ต่อไปจะมาทำความเข้าใจเกี่ยวกับ Layout cell ดังนี้
โดยเริ่มจากคลิกแท็บเมนู Insert ก็จะแสดง Ribbon ที่แสดงเครื่องมือเกี่ยวกับการแทรกวัตถุต่างๆ  
ให้เราเลือกไปที่ Layout Box และเลือก New Layout Box ดังรูปที่ 6 และจะแสดง window ใหม่
ให้เรากำหนดขนาดของ Layout ในรูปที่ 7

รูปที่ 6

รูปที่ 7

เมื่อกำหนดเสร็จแล้ว ก็จะได้บริเวณ Layout ดังรูปที่ 8

รูปที่ 8

อย่าลืมและสับสนครับ รูปที่ 8 ด้านบนนี้คือ Layout Box ซึ่งเป็นบริเวณเต็มบนหน้าเว็บเพจที่เราจะทำ
การออกแบบ ต่อไปเราจะทำการใช้ Layout cell โดยคลิกไปที่ Layout Box  ก็จะมีเมนูให้เลือก ให้เรา
ทำการเลือก Draw Layout Cell ก็จะมีเครื่องหมายรูป + เป็นเคอร์เซอร์ให้เราใช้งาน ให้ทำการลาก
บริเวณที่ต้องการ ดังรูปที่ 9

รูปที่ 9

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

รูปที่ 10

เมื่อเราคลิกเม้าส์ซ้ายค้างไว้เราก็สามารถเคลื่อนย้าย Layout cell นี้ไปที่อื่นๆได้ รูปที่ 11

รูปที่ 11

อย่าลืมว่า Layout cell ก็คือพื้นที่ทำงานเพื่อจัดวางองค์ประกอบเท่านั้น  เราสามารถพิมพ์ข้อความและ
แทรกรูปต่างๆได้ตามปรกติ

รูปที่ 12