1. รายงาน
เรือง การใช้ งาน Layout
เสนอ
คุณครู สุชาติ นาดี
จัดทําโดย
น.ส.ปวีณา รอบแคว้ น เลขที 17
น.ส.อุไรพร สุ ขจิตร เลขที 28
ชันมัธยมศึกษาปี ที 5/3
เขตพืนทีการศึกษามัธยมศึกษา เขต 32
โรงเรียนรมย์ บุรีพทยาคม รัชมังคลาภิเษก
ิ
ปี การศึกษา 2554
ภาคเรียนที 2

2. คํานํา
รายงานฉบับนี เป็ นส่ วนหนึงของวิชาคอมพิวเตอร์ ชันมัธยมศึกษาปี ที 5 โดยมีจุดประสงค์ เพือ
การศึกษาความรู ้เกียวกับส่ วนประกอบของโปรแกรม Dreamweaver ในหัวข้อ Layout ซึงรายงานนีมีเนื อหา
เกียวกับ การใช้ Layout
ผูจดทําได้เลือก หัวข้อนีในการทํารายงาน เนื องมาจากเป็ นเรื องทีน่าสนใจ ผูจดทําจะต้องขอขอบคุณ
้ั ้ั
อ.สุ ชาติ นาดี ผูให้ความรู ้ และแนวทางการศึกษา เพือนๆทุกคน ทีให้ความช่วยเหลือมาโดยตลอด ผูจดทํา
้ ้ั
หวังว่ารายงานฉบับนีจะให้ความรู ้ และเป็ นประโยชน์แก่ผอ่าน ทุกๆท่าน
ู้
จัดทําโดย
น.ส.ปวีณา รอบแค้วน
น.ส.อุไรพร สุ ขจิตร

3. สารบัญ
เรือง หน้ า
Standard 1
Expanded 1
Insert Div Tag 1
Draw AP Div 1
Spry Menu Bar 1
Spry Tabbed Panels 1
Spry Accordion 1
Spry Collapsible Panels 1
Table 1
Insert Row Above 2
Insert Row Below 2
Insert Column to the Left 2
Insert Column to the Right 2
IFrame 2
Frame 2
Left Frame 2

4. Right Frame 2
Top Frame 2
Bottom Frame 2
Bottom and Nested Left Frame 2
Bottom and Nested Right Frame 2
Left and Nested Bottom Frame 3
Right and Nested Bottom Frame 3
Top and Bottom Frame 3
Left and Nested Top Frame 3
Right and Nested Top Frame 3
Top and Nested Left Frame 3
Top and Nested Right Frame 3
Draw Layout Table (Layout mode only) 3
Draw Layout Cell (Layout mode only) 3

5. 1
การใช้ งาน Layout
รู ปภาพ ชื อภาษาอังกฤษ ชื อภาษาไทย วิธีการใช้ งาน
Standard ใช้ ในการเปิ ดมุมมองแบบปกติ
มุมมองปกติ เมือเริ มใช้ โปรแกรมครังแรก
Expanded เป็ นมุมมองทีช่วยให้ เห็น
มุมมองขยาย โครงสร้ างและขอบเขตของตาราง
ทังหมด
Insert Div Tag
แทรกแท็ก Div ใช้ สาหรับกําหนดกลุมเนือหา
ํ ่
Draw AP Div ใช้ ในการวาด โดยใช้ เครื องมือ
วาดด้ วยเครื องมือ AP Div Draw AP Div
Spry Menu Bar ใช้ ในการสร้ างเมนูสาหรับเว็บไซต์
ํ
สร้ างเมนูบาร์ ทังแบบแนวตังหรื อแนวนอน
ใช้ ในการจัดแบ่งเนือหาทีมี
สร้ างแท็บสําหรับแบ่งเนือหา ลักษณะเป็ นกลุมหรื อหมวดหมู่ โดย
่
Spry Tabbed Panels
นํามาวางซ้ อนกันไว้ แล้ วควบคุมการ
แสดงผลด้ วยแท็บ
Spry Accordion ใช้ ในการสร้ างกรอบแบบพับเก็บ
สร้ างกรอบแบบพับได้ ได้ ซึงมีลกษณะคล้ ายๆกับ tabbed
ั
panels
ใช้ ในการสร้ างกรอบคล้ ายๆกับ
accordion แต่แตกต่างกันตรงที
Spry Collapsible สร้ างกรอบแบบซ่อนได้
collapsible panels จะมีขนาด
Panels ยืดหยุนไปตามเนือหาและมีเพียง
่
กรอบเดียว
Table ตาราง ใช้ ในการจัดหน้ าเว็บเพจด้ วยตาราง

6. 2
Insert Row Above แทรกแถวด้ านบน ใช้ ในการแทรกแถวใหม่เหนือ
Insert Row Below
แทรกแถวด้ านล่าง ใช้ ในการแทรกแถวใหม่ใต้
Insert Column to the ใช้ ในการแทรกคอลัมน์แถวใหม่
แทรกคอลัมน์แถวไปทางซ้ าย ทางซ้ าย
Left
Insert Column to the ใช้ ในการแทรกคอลัมน์แถวใหม่
แทรกคอลัมน์แถวไปทางขวา ทางขวา
Right
IFrame เฟรมของฉัน ใช้ ในการดูโค้ ดของเว็บเพจ
Frame ใช้ ในการแบ่งพืนทีบนวินโดว์ของ
เฟรม บราวเซอร์ ออกเป็ นหลายๆส่วน
Left Frame ใช้ ในการแบ่งพืนทีบนวินโดว์ของ
เฟรมซ้ าย บราวเซอร์ ออกทางด้ านซ้ าย
Right Frame ใช้ ในการแบ่งพืนทีบนวินโดว์ของ
เฟรมขวา บราวเซอร์ ออกทางด้ านขวา
Top Frame ใช้ ในการแบ่งพืนทีบนวินโดว์ของ
เฟรมบน บราวเซอร์ ขนบน
ึ
Bottom Frame ใช้ ในการแบ่งพืนทีบนวินโดว์ของ
เฟรมล่าง บราวเซอร์ ลงล่าง
Bottom and Nested ใช้ ในการแบ่งพืนทีบนวินโดว์ของ
เฟรมด้ านซ้ ายและด้ านล่างที บราวเซอร์ เฟรมด้ านซ้ ายและ
Left Frame ซ้ อนกัน ด้ านล่างทีซ้ อนกัน
Bottom and Nested ใช้ ในการแบ่งพืนทีบนวินโดว์ของ
เฟรมด้ านขวาและด้ านล่างที บราวเซอร์ เฟรมด้ านขวาและ
Right Frame ซ้ อนกัน ด้ านล่างทีซ้ อนกัน

7. 3
Left and Nested ใช้ ในการแบ่งพืนทีบนวินโดว์ของ
เฟรมด้ านล่างซ้ ายและทีซ้ อน บราวเซอร์ เฟรมด้ านล่างซ้ ายและที
Bottom Frame กัน ซ้ อนกัน
Right and Nested ใช้ ในการแบ่งพืนทีบนวินโดว์ของ
เฟรมด้ านล่างขวาและทีซ้ อนกัน บราวเซอร์ เฟรมด้ านล่างขวาและที
Bottom Frame
ซ้ อนกัน
Top and Bottom ใช้ ในการแบ่งพืนทีบนวินโดว์ของ
เฟรมด้ านบนและด้ านล่าง บราวเซอร์ เฟรมด้ านบนและ
Frame
ด้ านล่าง
Left and Nested Top ใช้ ในการแบ่งพืนทีบนวินโดว์ของ
เฟรมด้ านบน ด้ านซ้ าย และ บราวเซอร์ เฟรมด้ านบน ด้ านซ้ าย
Frame ด้ านทีซ้ อนกัน และด้ านทีซ้ อนกัน
Right and Nested Top ใช้ ในการแบ่งพืนทีบนวินโดว์ของ
เฟรมด้ านบน ด้ านขวา และ บราวเซอร์ เฟรมด้ านบน ด้ านขวา
Frame ด้ านทีซ้ อนกัน และด้ านทีซ้ อนกัน
Top and Nested Left เฟรมด้ านซ้ าย ด้ านบน และ ใช้ ในการแบ่งพืนทีบนวินโดว์ของ
ด้ านทีซ้ อนกัน บราวเซอร์ เฟรมด้ านซ้ าย ด้ านบน
Frame
และด้ านทีซ้ อนกัน
Top and Nested Right เฟรมด้ านขวา ด้ านบน และ ใช้ ในการแบ่งพืนทีบนวินโดว์ของ
ด้ านทีซ้ อนกัน บราวเซอร์ เฟรมด้ านขวา ด้ านบน
Frame
และด้ านทีซ้ อนกัน
Draw Layout Table วาดเค้ าโครงตาราง ใช้ ในการวาดเค้ าโครงของตาราง
(โหมดเค้ าโครงเท่านัน) ในโหมดเค้ าโครงเท่านัน
(Layout mode only)
Draw Layout Cell วาดเค้ าโครงของเซลล์ ใช้ ในการวาดเค้ าโครงของเซลล์
(โหมดเค้ าโครงเท่านัน) ในโหมดเค้ าโครงเท่านัน
(Layout mode only)