แบ่งหน้าจอโดยใช้ Frame

HTML

    ปรกติเราจะแสดงเว็บเพจใน browser ได้ที่ละ 1 เว็บเพจ แต่ถ้าเราใช้ Frame เราจะสามารถแสดงเว็บเพจได้หลายๆเว็บเพจในหน้าเดียว โดยจะแบ่งหน้าของ browser ออกเป็นส่วนๆ โดยใช้ Frame

เรามาลองสร้าง Frame กันง่ายๆดู

ลองพิมพ์ดูง่ายนิดเดียว คลิกที่หัวข้อเพื่อทดลองพิมพ์

    1.การแบ่ง frame แบบแนวตั้ง
    frame ในแนวตั้งซึ่งจะเปิดเว็บเพจถึง 3 ไฟล์ในหน้าเดียวกันโดยเราจะแบ่งขนาดของ frame เป็น % หรือเป็น (px) pixel ก็ได้

    รูปแบบของ frame แนวตั้ง

<html>

<frameset cols=ขนาดเฟรม1,ขนาดเฟรม2>

<frame src='เว็บเพจ1'>

<frame src='เว็บเพจ2'>

</frameset>

</html>


    2.การแบ่ง frame แบบแนวนอน
    การแบ่งแบบแนวนอน ก็สามารถทำได้เช่นเดียวกัน ซึ่งแบ่งเป็น % หรือ px (pixel) ก็ได้เช่นกัน ซึ่งเราจะใช้ rows (แถว) แทน cols (หลัก)

    รูปแบบของ frame แนวนอน

<html>

<frameset rows=ขนาดเฟรม1,ขนาดเฟรม2>

<frame src='เว็บเพจ1'>

<frame src='เว็บเพจ2'>

</frameset>

</html>


    3. <noframes>
    ถ้า browser ของคุณไม่สนับสนุน frame จะมีคำเตือนตามที่เราเขียนขึ้นมา

<html>

<noframes>

<body> คำเตือน </body>

</noframes>

</html>


    4.ลองเอา frame แนวตั้งและแนวนอนมารวมกัน
    ในตัวอย่างนี้จะนำเอา frame แนวตั้งและแนวนอนมารวมกัน ซึ่งเป็นการซ้อนกันของ frame นั่นเอง

    5.ห้ามเปลี่ยนขนาดของ frame
    frame ในตัวอย่างที่ผ่านมานั้นจะสังเกตุได้ว่าสามารถเปลี่ยนขนาดได้ตามใจของเรา แต่ถ้าเราไม่ต้องการให้ผู้ใช้เปลี่ยนขนาดเราต้องใช้คำสั่ง noresize ซึ่งเป็น Attributes มาช่วย

    6.การใช้ link ให้สัมพันธ์กันใน frame
    ข้อดีของ frame ที่จะเห็นได้ก็คือ ใช้ในการทำเมนู ดังในตัวอย่างนั่นเองซึ่งจะต้องใช้ ไฟล์ 2 ไฟล์ ดังนี้

    1.ไฟล์ที่ใช้จัด frame ดังในตัวอย่างซึ่งจะเห็นว่าเราได้ใส่ชื่อ(name) ให้กับ frame ที่เราสร้างขึ้นมาด้วย

    2. ไฟล์ที่ใช้ทำเป็น link ของเราซึ่งมีคำสั่ง target='frame' หมายความว่าให้แสดงผลใน frame ที่มีชื่อว่า frame2 นั่นเอง มี soure code ดังนี้

<html>

<body>

    เว็บไซต์ที่น่าสนใจ

    <a href="http://www.hellomyweb.com" target="frame2">

    hellomyweb</a>

    <a href="http://www.w3schools.com" target="frame2">

    w3schools </a>

</body>

</html>



    7. การใช้ link ให้ปิด frame ทั้งหมด
    ในตัวอย่างนี้จะเป็นการสร้าง link ให้ทำลาย frame ทั้งหมด ซึ่งเราจะใช้คำสั่ง target ซึ่งมีรายละเอียดดังนี้

    1.target='_top'เป็นคำสั่งให้เปิด link ทับหน้าเดิมทั้งหมด ซึ่งจะปิด frame ทั้งหมดเช่นเดียวกัน

    2.target='_blank' เป็นคำสั่งให้เปิด link ในหน้าใหม่

    3.target='_self' เป็นคำสั่งให้เปิด link ใน frame ปัจจุบัน

    8. iframe
    เป็น frame รูปแบบหนึ่ง นิยมใช้ในส่วนที่เป็นโฆษณา เนื่องจากทำให้เราสะดวกไม่ต้องมาแก้ที่หน้าหลักแต่แก้ที่หน้าที่เป็นโฆษณาได้เลย ซึ่งเราอาจเอาให้หน้าที่เป็นโฆษณาให้ลูกค้าแก้ไขโดยไม่ต้องยุ่งกับหน้าหลักของเรา

** เราจะใช้ Frameset ใน <body> </body> ไม่ได้ยกเว้นกรณีของ <noframes>

เกี่ยวกับบทความนี้

  • ระดับความยาก : พื้นฐาน
  • คะแนนของบทความนี้ : 7
  • สร้างเมื่อ : 16-05-2010
  • จำนวนครั้งที่เปิด : 4,994
  • เนื้อหาที่เกี่ยวข้อง :
      -

คะแนนความน่าสนใจ

253

คลิกที่ เด็ดดวง! เพื่อโหวตให้กับบทความนี้หากคิดว่าน่าสนใจ

บทความอื่นๆในหมวดลองทำเว็บไซต์ แบบง่ายๆ (12 เรื่อง)

บทนำ HTML

บทนำ HTML

ที่มาของ HTML และพื้นฐานการใช้งาน HTML ในบทนี้จะเป็นต้องใช้โปรแกรมอย่าง Text editer ถ้าคุณยังไม่เคยใช้งานแนะนำให้อ่านหัวข้อ ลองทำเว็บแบบง่ายๆ ดูก่อนเพื่อเป็นพื้นฐานในการอ่านบทนี้

สร้างเมื่อ : 16-05-2010 9:01 | จำนวนครั้งที่เปิด : 7,530


โครงสร้างคำสั่งของ HTML

โครงสร้างคำสั่งของ HTML

ในบทนี้จะเป็นโครงสร้างคำสั่ง(tag) ของ HTML

สร้างเมื่อ : 16-05-2010 10:12 | จำนวนครั้งที่เปิด : 10,526


คำสั่งในการจัดหน้า

คำสั่งในการจัดหน้า

ในบทนี้จะเป็นคำสั่ง Tag พื้นฐานของ HTML ในส่วนของ body section ที่ใช้ในการจัดหน้าเช่น จัดย่อหน้า จัดให้ชิดซ้าย ชิดขวา

สร้างเมื่อ : 16-05-2010 8:18 | จำนวนครั้งที่เปิด : 6,950


คำสั่งในการกำหนดลักษณะตัวอักษร และแสดงสัญลักษณ์ต่างๆ

คำสั่งในการกำหนดลักษณะตัวอักษร และแสดงสัญลักษณ์ต่างๆ

ตัวเอียง ตัวหนา บทนี้จะบทคำสั่งที่เกี่ยวกับตัวอักษรทั้งหลายกัน รวมถึงสัญลักษณ์ต่างๆ

สร้างเมื่อ : 16-05-2010 8:18 | จำนวนครั้งที่เปิด : 6,732


เชื่อมต่อเอกสารของเราด้วย hyperlink

เชื่อมต่อเอกสารของเราด้วย hyperlink

เว็บไซต์ของเราประกอบด้วย web page มากมาย ซึ่งเราจะใช้ hyperlink ในการเชื่อมโยงเอกสารเหล่านั้น

สร้างเมื่อ : 16-05-2010 8:19 | จำนวนครั้งที่เปิด : 4,252


แบ่งหน้าจอโดยใช้ Frame

แบ่งหน้าจอโดยใช้ Frame

ปรกติเราจะแสดงเว็บเพจใน browser ได้ที่ละ 1 เว็บเพจ แต่ถ้าเราใช้ Frame เราจะสามารถแสดงเว็บเพจได้หลายๆเว็บเพจในหน้าเดียว โดยจะแบ่งหน้าของ browser ออกเป็นส่วนๆ โดยใช้ Frame

สร้างเมื่อ : 16-05-2010 9:59 | จำนวนครั้งที่เปิด : 4,994


Table คำสั่งที่สำคัญสุดในการทำเว็บเพจ

Table คำสั่งที่สำคัญสุดในการทำเว็บเพจ

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

สร้างเมื่อ : 16-05-2010 8:23 | จำนวนครั้งที่เปิด : 4,781


list จัดข้อมูลในเว็บเพจให้เป็นระเบียบ

list จัดข้อมูลในเว็บเพจให้เป็นระเบียบ

list tag ใช้ในการจัดข้อมูลเป็นชุดๆ หรือเป็นหัวข้อ ซึ่งจะทำให้ข้อมูลอ่านได้ง่ายขึ้น

สร้างเมื่อ : 16-05-2010 8:23 | จำนวนครั้งที่เปิด : 2,696


การสร้างแบบฟอร์ม

การสร้างแบบฟอร์ม

เว็บไซต์นั้นต่างจากเอกสารธรรมดา ตรงที่สามารถตอบโต้กับผู้ใช้งานได้ เช่นการใช้ search (ค้นหา) ในเว็บไซต์ hellomyweb.com ช่องรับค่าของ search นั้นก็คือแบบฟอร์มใน html นั่นเอง

สร้างเมื่อ : 16-05-2010 8:37 | จำนวนครั้งที่เปิด : 3,642


การใส่รูปในเว็บเพจ

การใส่รูปในเว็บเพจ

รูปนั้นสามารถบรรยายรายละเอียดได้ดีกว่าคำพูดมาก ดังนั้นแทบทุกเว็บไซต์จึงมีรูปอยู่เกือบทุกเว็บไซต์ ในบทความนี้เราจะมาใส่รูปในเว็บเพจกัน

สร้างเมื่อ : 16-05-2010 8:24 | จำนวนครั้งที่เปิด : 3,877


การใส่ภาพพื้นหลัง ให้เว็บเพจ

การใส่ภาพพื้นหลัง ให้เว็บเพจ

ภาพพื้นหลังเป็นสิ่งที่ทำให้เว็บของเราดูสวยงามแต่ถ้าเราใช้ภาพพื้นหลังที่ไม่ดี อาจส่งผลเสียกับเว็บเราได้ ในบทความนี้จะเป็นตัวอย่างของการใส่พื้นหลังที่ดี และไม่ดี

สร้างเมื่อ : 16-05-2010 10:17 | จำนวนครั้งที่เปิด : 8,833


การใช้งานสีในเว็บเพจ

การใช้งานสีในเว็บเพจ

สีสันนั้นอยู่คู่กับเว็บเพจอยู่แล้ว เพราะนอกจากจะทำให้เว็บดูสวยงามน่าสนใจแล้ว ยังช่วยให้การอธิบายข้อความดีขึ้นอีก ในบทความนี้เราจะมีดูการใช้งานสีกัน

สร้างเมื่อ : 16-05-2010 8:26 | จำนวนครั้งที่เปิด : 3,237