ลำดับตอนที่ #45
คืนค่าการตั้งค่าทั้งหมด
คุณแน่ใจว่าต้องการคืนค่าการตั้งค่าทั้งหมด ?
ลำดับตอนที่ #45 : การวางเลย์เอาท์หน้าเว็บ II
โปรแกรมที่ใช้ ดรีม
ระดับความยาก 4/5
บทความที่ควรอ่านก่อน แนะนำการใช้ดรีมเบื้องต้น - แทรกตาราง
ขั้นที่ 3 กดแทรกตาราง โดยใส่จำนวนแถวและคอลัมม์ที่เรานับในขั้นที่ 2 ลงไป ส่วนความกว้างให้ใส่เป็น 100% border/padding/spacing เซตเป็น 0 (ใครยังไม่ได้อ่านวิธีแทรกตารางและไม่เข้าใจ กลับไปอ่านละเอียดๆ ที่ แนะนำการใช้ดรีมเบื้องต้น - แทรกตาราง ได้ค่ะ)
ขั้นที่ 4 รวมช่องให้เหมือนตามตามเลย์เอาท์ที่วางไว้ในขั้นที่ 1
ตัวอย่างเดิม อิอิ
เวลาแทรกตาราง เราใส่ row2 col3 จะได้เป็นแบบด้านล่าง (ด้านซ้ายคือตอนแทรกใหม่ๆ ด้านขวาคือเป้าหมาย เป็นตารางที่เหมือนเลย์เอาท์ที่วางไว้)
การเปลี่ยนก็คือการรวมช่อง เช่นตัวอย่างนี้ แถวแรกนั้นมีเพียงแค่ช่องเดียว เราก็ต้องรวม 3 ช่องเป็นช่องเดียว วีธีรวมคือให้เลือกช่องที่จะรวม คลิกขวา > table > merge cells
เสร็จสิ้นการวางเลย์เอาท์ค่ะ เอ้อ เกือบลืม กรณีทำไอดีดรีม ให้ใส่ตารางไว้ในเลเยอร์นะคะ ไม่งั้นมันไม่ทับน้า
ตัวอย่างผลงาน
อันนี้เราปรับความสูงของตารางให้เท่ากับขนาดบีจี (คลิกเลือกตาราง แล้วปรับที่หน้า properties ด้านล่าง) จากนั้นเอาเมาส์ไปชี้ตรงขอบ (ที่เห็นเป็นเส้นสีเทา) แล้วเลื่อนปรับขนาดช่องตามต้องการค่ะ
เก็บเข้าคอลเล็กชัน
ความคิดเห็น