บทช่วยสอนที่กระชับของ Dreamweaver 4 (7. เค้าโครงหน้าเว็บ)

ผู้เขียน：Eve Cole เวลาอัปเดต：2009-05-30 18:35:53

7. เค้าโครงหน้าเว็บ

การใช้ตาราง

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

คลิกที่แผงวัตถุ

คุณจะเห็นกล่องโต้ตอบต่อไปนี้:

1 แถว: จำนวนแถวในตาราง; คอลัมน์: จำนวนคอลัมน์ในตาราง;

2 ความกว้าง: ความกว้างของตาราง หน่วยอาจเป็นพิกเซล (จำนวนพิกเซล) หรือเปอร์เซ็นต์ (เปอร์เซ็นต์) ขนาดของตารางที่กำหนดเป็นพิกเซลได้รับการแก้ไขแล้ว ในขณะที่ตารางที่กำหนดเป็นเปอร์เซ็นต์จะเปลี่ยนไปตามขนาดของเบราว์เซอร์ ความแตกต่างระหว่างวิธีการนิยามทั้งสองวิธีจะมีการอธิบายในเชิงลึกในภายหลัง

3 เส้นขอบ: ความกว้างของเส้นตาราง

④ การเว้นวรรคของเซลล์: ระยะห่างระหว่างเซลล์; ระยะห่างระหว่างเซลล์: ขอบเซลล์ เซลล์ที่เรียกว่าหมายถึงเซลล์ขนาดเล็กแต่ละเซลล์ในตาราง

หลังจากตั้งค่าตามภาพแล้วจะได้แบบฟอร์มดังนี้

คลิกที่เส้นตารางเพื่อเลือกทั้งตาราง คุณสามารถดูสิ่งนี้ได้ในแผงคุณสมบัติ:

1 แถว, Cols: แถวและคอลัมน์ของตาราง

2 W, H: ความกว้างและความสูงของตาราง โดยปกติแล้ว เราไม่ได้กำหนดความสูงของตาราง

3 CellPad, CellSpace: ระยะห่างระหว่างเซลล์และระยะขอบของเซลล์ เส้นขอบ: ความกว้างของเส้นตาราง;

④ Ailgn: การจัดแนวตาราง คุณสามารถเลื่อนตารางไปทางซ้าย (ซ้าย) ตรงกลาง (กลาง) หรือขวา (ขวา)

⑤

: กำจัดการตั้งค่าความสูงของแถว

: กำจัดการตั้งค่าความกว้างของคอลัมน์

: แปลงการตั้งค่าความกว้างของตารางจากเปอร์เซ็นต์เป็นพิกเซล

: แปลงการตั้งค่าความกว้างของตารางจากพิกเซลเป็นเปอร์เซ็นต์

⑥ Bg Color: ตั้งค่าสีพื้นหลังของตาราง

⑦ สี Brdr: ตั้งค่าสีของเส้นตาราง

⑧ Bg Image: ตั้งค่าภาพพื้นหลังของตาราง หากตั้งค่าภาพพื้นหลังไว้ สีพื้นหลังจะไม่ถูกต้อง คลิกปุ่มกระเป๋าเอกสารที่ด้านหลังเพื่อเลือกภาพพื้นหลัง

หากเราเลื่อนเคอร์เซอร์ไปที่เซลล์ใดเซลล์หนึ่ง แผงคุณสมบัติที่เราเห็นจะแตกต่างออกไป:

: ผสานเซลล์ (ก่อนอื่นคุณต้องเลือกเซลล์ที่เกี่ยวข้องที่จะผสาน)

: แยกเซลล์ออกเป็นหลายแถวหรือหลายคอลัมน์

② Horz: การจัดตำแหน่งตามแนวนอนภายในเซลล์ ฟังก์ชันจะเหมือนกับ

คล้ายกัน;
สีเขียว: การจัดตำแหน่งแนวตั้งภายในเซลล์

3 W, H: ความกว้างและความสูงของเซลล์;

④ Bg: ภาพพื้นหลังของเซลล์;

⑤ Bg: สีพื้นหลังของเซลล์;

⑥ Brdr: สีเส้นขอบของเซลล์