การแบ่งเฟรม ( frame )
การแบ่งจอภาพออกเป็นส่วน ๆ หรือ
ที่เรียกว่า เฟรม ( frame )
เฟรม (Frame)
ถือว่าเป็นคำสั่งหนึ่งใน การเขียน HTML โดยเฟรม (Frame) จะช่วยให้ สามารถ แสดง
ผลไฟล์ HTML หลาย ๆ ไฟล์ได้พร้อม ๆ กัน ภายใต้ เว็บเพจ เดียวกัน ตามปกติแล้ว หนึ่งเว็บเพจ
เราจะมีไฟล์ HTML อยู่ไฟล์เดียว แต่ถ้าเราต้องการ แบ่งหน้าจอของเว็บเพจ ให้เป็น
3 - 4 ส่วน โดยแต่ละส่วน มีความเป็นอิสระ ของตัวเอง ใช้ HTML ของตัวเอง คำสั่ง
เฟรม (Frame) จะช่วยในการจัดการงานดังกล่าว
ในปัจจุบัน
เฟรม(Frame) เป็นคำสั่ง ที่ได้รับความนิยม อย่างมาก
ในการนำมาใช้ ตกแต่ง
เอกสาร HTML ส่วนใหญ่ จะนำเฟรม (Frame) มาเพิ่มใส่ใน HTML เพื่อปรับแต่ง ให้พอดูดีขึ้น
อย่างเช่น การนำเฟรม (Frame) มาใช้ ในการล็อคให้ โฮมเพจ ของเรา มีส่วนหัว และส่วนท้าย
เหมือน ๆ กันทุก หน้าจอ คล้าย ๆ กับ การพิมพ์ จดหมาย ที่มีหัวกระดาษท้ายกระดาษ
หรือการนำเฟรม (Frame) มาทำ เป็นเมนู ซึ่งเราสามารถ บังคับให้เฟรม (Frame) ที่บรรจุ
เมนู อยู่โดย ไม่เปลี่ยนแปลง ส่วนอีกเฟรม (Frame) หนึ่ง ก็แสดง เนื้อหากันไป
ลักษณะและข้อจำกัดของเฟรม (Frame)
เฟรม (Frame)
ส่วนมาก มีลักษณะ เป็นรูป สี่เหลี่ยมอย่างเดียว เราไม่ สามารถ สร้างเฟรม (Frame)
เป็นรูปสามเหลี่ยม วงกลม ห้าเหลี่ยม หกเหลี่ยม ได้ตามใจชอบ ส่วนเฟรม (Frame) ที่
ซับซ้อน เกินไป เราก็อาจจะสร้างไม่ได้
ระบบโครงสร้าง
คำสั่ง
แรกที่ต้องใช้ ในการสร้าง เฟรม (Frame) ก็คือ Tag คำสั่ง <FRAMSET> คำสั่งนี้เป็นคำสั่ง
ที่ใช้ใน การกำหนด ขนาดและ รูปแบบของเฟรม (Frame) ที่ต้องการ คำสั่ง <FRAMSET>
เป็นคำสั่ง ที่มาแทน คำสั่ง <BODY> ในไฟล์ HTML โดยมีโครงสร้างดังนี้
<HTML> ……... |
คำสั่ง <FRAMESET> ใช้ในการกำหนดเฟรม (Frame) รูปแบบการใช้คำสั่ง <Frameset> เป็นคำสั่งที่ระบุให้โปรแกรมบราวเซอร์แบ่งหน้าจอออกเป็นเฟรม มี 2 ประเภท คือ
1.
แบ่งเฟรมตามแนวตั้ง <frameset cols="value1, value2
2.
แบ่งตามแนวนอน lt;frameset rows="value1, value2
การกำหนดค่าให้กับ
value มีอยู่ 3 แบบ คือ
1.
กำหนดค่าให้มีหน่วยเป็นพิกเซล (Pixel) เช่น
<frameset cols="200, 600">
2. กำหนดค่าให้มีหน่วยเป็นเปอร์เซ็นต์ (%) เช่น
<frameset cols="25%, 25%, 50%">
3. กำหนดค่าตามความสัมพันธ์ของแต่ละเฟรม จะแทนโดยเครื่องหมาย (* ) เช่น
<frameset cols="240, * ">
<frameset cols=" *, * , *">
คำสั่ง <FRAMESET> มี คำสั่งรอง หรือแอตทริบิวต์ (Attribute) คือ
<FRAME
SRC=ชื่อไฟล์ที่ต้องการแสดง"> เป็นการกำหนด
ค่าต่าง ๆ ที่จะแสดงในพื้นที่จอภาพ ไม่ว่าจะเป็น .htm , .html หรือ .gif , .jpg
ก็ได้ทั้งหมด
<NOFRAME>
คำสั่งนี้จะถูกแสดง เมื่อถูกเรียกใช้โดยเว็บเบาวเซอร์ (Web browser) รุ่นเก่า ที่แสดงผลแบบเฟรม
(Frame) ไม่ได้
<FRAME
NAME= NAME">
ชื่อเฟรม (FRAME) ที่ตั้งขึ้น
<FRAME
MARGINWIDTH=Value">
ใช้กำหนดความกว้างของช่องว่างด้านซ้ายและขวา (Margin) ระหว่างขอบของเฟรม
(FRAME) กับข้อมูลในเฟรม (FRAME)
<FRAME
MARGINHEIGHT=Value> ใช้กำหนดความกว้างของช่องว่างด้านบนและล่าง
(Margin) ระหว่างขอบของเฟรม (FRAME) กับข้อมูลในเฟรม (FRAME)
<FRAME
SCROLLING=YES , NO , AUTO>
ใช้กำหนดให้โปรแกรมบราวเซอร์แสดง/ซ่อนแถบเลื่อน (Scrolling bar)
ที่ด้านข้างและด้านล่างของเฟรม (FRAME) เมื่อข้อมุลมีความยาวมากกว่า 1 หน้าจอ
ตัวเลือกเพื่อแสดง/ซ่อนแถบเลื่อน
มี 3 ตัวเลือก
YES
หมายถึง แสดงแถบเลื่อน
NO
หมายถึง ซ่อนแถบเลื่อน
AUTO
หมายถึง แสดงแถบเลื่อนก็ต่อเมื่อข้อมูลมีความยาวมากกว่า 1 หน้าจอ (ค่า default)
<FRAMEBORDER=
0 , 1 > ใช้กำหนดให้โปรแกรมบราวเซอร์แสดง/ซ่อนเส้นแบ่งเฟรม
ตัวเลือกเพื่อแสดง/ซ่อนเส้นแบ่งเฟรม มี 2 ตัวเลือก คือ
0
หมายถึง ซ่อนเส้นแบ่งเฟรม
1
หมายถึง แสดงเส้นแบ่งเฟรม
border="1"
กำหนดขนาดความหนาของเส้นแบ่งเฟรม (Frame)
bordercolor="#0033FF"
กำหนดสีของเส้นแบ่งเฟรม (Frame)
<NORESIZE>ใช้กำหนดให้ผู้ใช้ไม่สามารถปรับเปลี่ยนขนาดของเฟรมได้
โดยปกติจะสามารถปรับได้ โดยคลิกเมาส์ที่เส้นแบ่งเฟรม
ตัวอย่างจากแฟ้มข้อมูล
(File) ชื่อ Test.html
| <html> <head> <title>ยินดีต้อนรับเข้าสู่เว็บไซด์ของฉัน</title> </head> <frameset cols = "155,*" frameborder="YES" border="1" framespacing="1" bordercolor="#0033FF"> <frame name = "menu" noresize src = "p1.html"> <frame name = "mainframe" noresize src = "02.html" > </frameset> </body> </html> |