หลังจากที่สร้างเฟรมเซตไว้เรียบร้อยแล้ว หากยังไม่ตรงตามที่ต้องการก็สามารถจัดการกับเฟรมเซตได้ดังนี้
การปรับขนาดเฟรม ถ้าเฟรมมีขนาดใหญ่หรือเล็กเกินไปสามารถปรับขนาดย่อหรือขยายได้ทั้งแนวตั้งและแนวนอนโดยคลิกที่เส้นของเฟรมและลากเมาส์ |
เฟรมเซต (Frameset) คือ การแบ่งหน้าเว็บเพจออกเป็นพื้นที่หลาย ๆ ส่วน โดยแต่ละส่วนแยกออกไปจะเป็นอิสระไม่ขึ้นต่อกัน ตามปกตินิยมใช้เฟรมเพื่อแบ่งเนื้อหาบนหน้าจอ
เป็น 2 กลุ่มเพื่อใช้แสดงหรือเปรียบเทียบข้อมูลเฟรมจะมี 2 รูปแบบ คือ เฟรมหลัก (Frameset) และเฟรมย่อย (Frame)
เฟรมหลัก (Frameset) คือ หน้าต่างเฟรมใหญ่ที่สุด ทำหน้าที่คอยควบคุมเฟรมย่อยอีกทีหนึ่ง โดยกำหนดว่าในแต่ละส่วนชื่ออะไร มีขนาดและคุณสมบัติอย่างไร เริ่มต้นที่ตำแหน่งใด เป็นต้น
เฟรมย่อย (Frame) หน้าต่างเฟรมที่ทำหน้าที่กำหนดชื่อของแต่ละเฟรม และกำหนดไฟล์เว็บเพจภายในเฟรมได้
การสร้างเฟรมเซตในโปรแกรม Adobe Dreamweaver CS5 สามารถทำได้ 2 วิธี มีขั้นตอนดังนี้
.jpg)
6. คลิกปุ่ม Create จะปรากฏหน้าต่างให้เลือกตั้งชื่อเฟรม
7. จะได้ รูปแบบเฟรมตามที่เลือก
3. ที่เว็บเพจจะปรากฏเส้นขอบของเฟรมเซตขึ้นมา เลื่อนเมาส์ไปที่เส้นขอบของเฟรมเซต คลิกและลากเมาส์เพื่อสร้างเฟรมเซต ถ้าต้องการจะดูรายละเอียดของเฟรมทั้งหมดให้เลือกคำสั่ง Window > Frames เพื่อเรียกพาเนล Frames
หลังจากที่สร้างเฟรมเซตไว้เรียบร้อยแล้ว หากยังไม่ตรงตามที่ต้องการก็สามารถจัดการกับเฟรมเซตได้ดังนี้
การปรับขนาดเฟรม ถ้าเฟรมมีขนาดใหญ่หรือเล็กเกินไปสามารถปรับขนาดย่อหรือขยายได้ทั้งแนวตั้งและแนวนอนโดยคลิกที่เส้นของเฟรมและลากเมาส์ |
การเพิ่มเฟรม
ถ้าเฟรมมีจำนวนไม่เพียงพอสามารถเพิ่มจำนวนได้
โดยเลือกคำสั่ง Modify > Frames set แล้วเลือกลักษณะการแบ่งเฟรมเซต 4 ลักษณะ คือ ซ้าย ขวา บน และล่าง
ถ้าเพิ่มเฟรมด้วยเส้นขอบเฟรมให้กดแป้น Alt กับลากเมาส์ที่เส้นขอเฟรม
เฟรมแต่ละเฟรมเป็นไฟล์ย่อย ๆ หนึ่งไฟล์ การแก้ไขรายละเอียดภายในเฟรมทำได้ 2 ลักษณะ คือ เฟรมหลัก และเฟรมย่อย การแก้ไขเฟรมหลัก คลิกเลือกเฟรมหลัก ถ้ามีหลายเฟรมและไม่แน่ใจว่าเฟรมใดเป็นเฟรมหลัก ให้เปิดพาเนล Frames และคลิกเลือกเฟรมหลัก |
เลือกปรับรายละเอียดของเฟรมหลักที่ Properties Inspector
Borders กำหนดให้แสดงหรือไม่แสดงเส้นขอบ
Borders Width กำหนดความกว้างของเส้นขอบเฟรม ค่า 0 ไม่มีเส้น
Border Color กำหนดสีของเส้นขอบเฟรม
Column กำหนดขนาดของคอลัมน์ เติมตัวเลขลงไปในช่อง Value และเลือกหน่วยวัด เช่น pixels
Row Col Selection โครงสร้างของเฟรมเซต
การแก้ไขเฟรมย่อย
เฟรมย่อยเป็นเฟรมทุกเฟรมที่บรรจุในเฟรมหลัก มีชื่อเรียกต่าง ๆ กัน เช่น topframe mainframe ฯลฯ ซึ่งสามารถแก้ไขรายละเอียดได้ ดังนี้
แก้ไขรายละเอียดเฟรมที่ Properties Inspector ดังนี้
Frame name ตั้งชื่อเฟรมย่อย ควรตั้งให้สื่อถึงเฟรมหลัก
Src ตำแหน่งที่ใช้บันทึกเว็บเพจของเฟรมนี้
Borders แสดง / ซ่อน เส้นขอบ
Scroll แสดง / ซ่อน แถบเลื่อนของเฟรมย่อย
No resize กำหนดให้ใช้เมาส์ลากเพื่อปรับขนาดเฟรมได้ หรือไม่ได้
Border color กำหนดสีของเฟรม
Margin width กำหนดระยะห่างของเฟรมย่อยกับเฟรมหลัก (กว้าง)
Margin height กำหนดระยะห่างของเฟรมย่อยกับเฟรมหลัก (สูง)
เฟรมเซตเปรียบเสมือนไฟล์งานหรือเว็บเพจแต่ละหน้าที่ซ้อนกันอยู่ในหน้าเว็บเพจเดียวกันดังนั้นการสร้างเนื้อหาหรือออกแบบแต่ละเฟรมจึงเป็นอิสระจากกัน สามารถพิมพ์ข้อความ แทรกภาพ ตาราง และตกแต่งเฟรมได้โดยไม่กระทบต่อเฟรมอื่น การใส่เนื้อหาในเฟรมแบ่งออกเป็น 2 ลักษณะ คือ สร้างเนื้อหาลงในเฟรมใหม่ และนำเนื้อหาที่สร้างไว้แล้วมาใส่เฟรม ดังนี้ สร้างเนื้อหาลงในเฟรมเซตใหม่ เมื่อได้เลือกเฟรมเซตหรือสร้างเฟรมเซตเสร็จแล้ว เช่น แบบ Fixed Top, Nested Left โดยกำหนดให้ Topframe เป็นส่วนหัวของบริษัท ประกอบด้วยชื่อและโลโก้ ส่วน Mainframe เป็นเนื้อหา รายละเอียดสินค้า และส่วนด้านซ้ายเป็นลิงค์ต่าง ๆ จะได้เว็บเพจลักษณะดังนี้ |
นำเนื้อหาที่สร้างไว้ใส่เฟรมเซต
เป็นการสร้างเนื้อหาย่อยแต่ละเฟรมก่อน แล้วจึงนำมาประกอบเว็บเพจภายหลัง มีวิธีทำ ดังนี้
1. สร้างเฟรมงานต่าง ๆ ไว้จนครบ แล้วบันทึกข้อมูล
2. สร้างเฟรมเซตตามจำนวนเฟรม แล้วกดแป้น < Shift > + < F2 > เพื่อเรียกพาเนล Frames
3. คลิกที่ไอคอน 
ในช่อง Src จะได้หน้าต่าง Select HTML file เลือกเฟรมเซตที่ต้องการ
4.ทดลองแสดงผลเฟรมเซตตามที่ออกแบบไว้บนเบราว์เซอร์
การบันทึกเฟรมหลักและเฟรมย่อยมีข้อแตกต่างกัน ดังนี้ การบันทึกเฟรมหลัก ในการบันทึกเฟรมหลัก (Frameset) มีขั้นตอนดังนี้ 1. คลิกที่โครงเฟรมหลัก ในหน้าต่าง Frame Panel |
2. คลิกเมนู File >> Save Frameset หรือกดปุ่ม < Ctrl + S > เพื่อบันทึกโครงเฟรม
3. เลือกสถานที่เก็บไฟล์จากช่อง Save in
4. พิมพ์ชื่อไฟล์ลงในช่อง File Name
5. คลิกปุ่ม Save เพื่อบันทึกเฟรม
การบันทึกเฟรมย่อย
การบันทึกเฟรมย่อย มีขั้นตอนดังนี้
1. คลิกที่โครงเฟรมย่อย ในหน้าต่าง Frame Panel
2. คลิกเมนู File >> Save Frame หรือกดปุ่ม < Ctrl + S > เพื่อบันทึกโครงเฟรม
3. เลือกสถานที่เก็บไฟล์จากช่อง Save in
4. พิมพ์ชื่อไฟล์ลงในช่อง File Name
5. คลิกปุ่ม Save เพื่อบันทึกเฟรม
การเชื่อมโยงเฟรมเซตมีประโยชน์มาก เพราะช่วยเลื่อนหน้าเว็บเพจให้แสดงผลข้อมูลได้ง่าย เช่น คลิกที่แท็บสินค้าใหม่ เฟรมเซตด้านขวามือจะแสดงผลสินค้าใหม่ให้ทันที โดยมีวิธีการเชื่อมโยง ดังนี้ 1. เลือกข้อความที่ต้องการจะสร้างลิงค์ 2. คลิกปุ่ม |
3. เลือกเฟรมที่ต้องการจะเป็นเป้าหมายการลิงค์ แล้วคลิก OK
4. กำหนดคุณสมบัติการแสดงผลจากช่อง Target เช่น เลือก Mainframe เพื่อให้ไฟล์ลิงค์ไว้มาแทรกแทนเฟรม Mainframe
5. บันทึกไฟล์ และทดลองแสดงผลด้วยเบราเซอร์ < F12 >
