อินเทอร์เน็ตออกแบบเว็บ

กรอบ - นี่คืออะไร? โครงสร้างและการสร้างเฟรม

กรอบ - พื้นที่ของเว็บไซต์ (หน้าต่าง) ในการที่เราดูหน้าเว็บอื่น เว็บมาสเตอร์กำลังใช้โอกาสนี้ในการแสดงหน้าบ้านของเพื่อนหรือเพื่อนร่วมงานของพวกเขา วิธีการเดียวกันถูกใช้เพื่อแสดงในช่องค้นหาของหน้าต่างและจำนวนของผลของมันและอื่น ๆ . D.

แต่ส่วนใหญ่เฟรมที่ใช้ในการสร้างเว็บพอร์ทัลขนาดใหญ่ที่มีจำนวนมากของเมนูและเมนูย่อย ดังกล่าวมักจะพูดว่า "เว็บไซต์ในเฟรม." เพื่อสร้างทรัพยากรดังกล่าวต้องใช้ความรู้ที่ดีของภาษา HTML

สร้างกรอบในการสร้างเว็บไซต์

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

แต่ส่วนใหญ่เฟรมที่ใช้ในการสร้างเว็บพอร์ทัลขนาดใหญ่ที่มีจำนวนมากของเมนูและเมนูย่อย ดังกล่าวมักจะพูดว่า "เว็บไซต์ในเฟรม." เพื่อสร้างทรัพยากรดังกล่าวต้องใช้ความรู้ที่ดีของภาษา HTML

ด้วย "บริการ" นี้เป็นไปได้ในการสร้างเฟรมหลายรายการในหน้าเพียงองค์ประกอบระหว่างที่เกี่ยวข้องเพื่อให้คุณไม่ได้รับ

กรอบใน CMS

หลายโปรแกรมสำหรับการสร้างเว็บไซต์เป็นไปได้ของการติดตั้งโมดูล ตัวอย่างเช่นสำหรับกรอบ Joomla - นี้โมดูล "เสื้อคลุม (Wrapper)"

มันสามารถพบและการตั้งค่าในแผงควบคุมของ CMS Joomla: "นามสกุล" - "ผู้จัดการโมดูล" - "ใหม่" (ปุ่มสีส้มกลมที่มีเครื่องหมายบวกภายใน) ใน หน้าต่างป๊อปอัพ ในรายการคุณจะเห็นโมดูลของ "เสื้อคลุม" a

ถ้ามันไม่ได้แล้วมันไม่ได้รวม ที่จะใช้มันคุณต้องเปิดใช้งานได้ที่นี่: แท็บ "ส่วนขยาย" ที่ "จัดการส่วนขยาย" แล้ว "จัดการ" แท็บ และกำลังมองหารายการที่ปรากฏขึ้นให้คุณได้อย่างรวดเร็วสามารถค้นหาใน "กรอง" เพื่อเข้าสู่คำว่า: Wrapper ตรงข้ามโมดูลนี้ควรจะเป็นไอคอนเครื่องหมายถูกสีเขียวภายใน วงกลมสีแดงที่มีจุดภายในหมายความว่าปลั๊กอินถูกปิดใช้งาน

หลังจากขั้นตอนนี้คุณสามารถกลับไปที่ "ผู้จัดการโมดูล" สร้างกรอบและตั้งค่าพารามิเตอร์ของมัน

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

นี่คือตัวอย่างของสิ่งที่กรอบใน Jumla

โมดูล Joomla สำหรับการสร้างกรอบมีความสะดวกมากและใช้งานง่าย แต่ขอบเขตของมี จำกัด เช่นเดียวกับคุณสมบัติของนักออกแบบ

ประวัติและความเป็นจริง

ในทางปฏิบัติของการสร้างเว็บไซต์ของเฟรมว่าแท็ก (แอพลิเคชันของเขา) ได้รับการผลักไสให้พื้นหลัง พวกเขาก็สามารถที่จะเปลี่ยนโมดูลในการตั้งโปรแกรมการออกแบบที่สร้างสำหรับหน้าเว็บโดยไม่ต้อง saytostroitelya อย่างไรก็ตามในบางกรณีนี้ไม่เพียงพอ ตัวอย่างเช่นเมื่อกรอบ - เป็นโครงสร้างที่ซับซ้อนแบบบูรณาการในพื้นที่ที่จะแสดงในเบราว์เซอร์ ดังนั้นเห็นเจ้าของเว็บไซต์ที่มีโครงสร้างที่ซับซ้อน ในการสร้างมันเป็นเพียงในกรณีที่รุนแรงเนื่องจากเว็บไซต์ freymovskie สร้างขึ้นเฉพาะกับแท็กพิเศษ

เว็บไซต์ที่มีโครงสร้างที่ซับซ้อน

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

วิธีการเพื่อให้บรรลุผลเดียวกันได้หรือไม่ วิธีการสร้างกรอบโครงสร้างหรือไม่?

วิธีการใส่กรอบในรหัสหน้า

กรอบจะมีการเพิ่ม HTML โดยใช้แท็ก:

  • กรอบ (สำหรับหน้าต่างที่แยกต่างหาก)
  • เฟรม (โครงสร้างทั้งหมดถูกสร้างขึ้นด้วยมัน);
  • iframe ( "ลอย" กรอบ);
  • NOFRAMES (ในกรณีของกรอบที่ไม่ได้แสดงอยู่ในเบราว์เซอร์ของผู้ใช้)

แท็กระบุแรกเสมอพอดีกับคู่ของ <เฟรม> และ และจะแทนที่ และ และมีคุณลักษณะที่เหมาะสมคุณสามารถปรับเปลี่ยนลักษณะของแต่ละรายการ: ชื่อ (ชื่อ =) ขนาด (cols = และแถว =) การปรากฏตัวของกรอบ (ชายแดน) รูปแบบของแถบเลื่อนและแน่นอนที่มีการเชื่อมโยงไปยังเว็บเพจที่จะแสดง

ลงทะเบียนรูปแบบ

หน้าเว็บไซต์ทั้งหมดสามารถแบ่งออกเป็นภูมิภาค ตัวอย่างเช่นนี้

ซ้าย

กรอบด้านบน

ขวา

เช่นโครงสร้าง (จะเรียกว่าซ้อนกัน) สามารถรับได้โดยการเขียนแท็กภายในคอลัมน์แอตทริบิวต์ซึ่งบ่งบอกสถานที่ตั้งของกรอบแนวนอนและแถว - แนวตั้ง มันควรจะใส่เครื่องหมายเท่ากับและขนาดที่กำหนด ยกตัวอย่างเช่น 60%, 40% - ร้อยละ (หน้าต่างหนึ่งจะใช้เวลา 60% ของเบราว์เซอร์พื้นที่อื่นตามลำดับ 40%) หรือ 100 200 - อัตราส่วนของขนาดพิกเซล ขนาดของหนึ่งในเฟรมก็เป็นไปไม่ได้ที่จะตั้งค่า (ตั้งค่าเริ่มต้น) การทำเช่นนี้ก่อนหรือหลังจุดทศนิยมคุณจะต้องระบุตัวอักษร *

ภายในเฟรมคู่นี้ลงทะเบียนกรอบกับพารามิเตอร์แต่ละ src = http: // เว็บไซต์ / บทความ / 143778 /% 2C ยกมาอ้างอิงซึ่งต่อไปนี้จะทำไปยังหน้าเว็บและชื่อชื่อ = (เช่นกรอบ 1)

ทำรังในแต่ละพื้นที่ใหม่ถูกกำหนดให้เป็นเฟรมใหม่

รหัสตัวอย่าง: <เฟรมแถว = "50" cols = "80,20"> <กรอบ src = "http://fb.ru/article/143778/%5B%D1%81%D1%81%D1%8B% D0 หน้า% BB% D0% BA% D0% B0] "name =" กรอบหมายเลข 1 "> <แถวเฟรม =" 80,20 "> <กรอบ src =" http://fb.ru/article/143778/ % 5B% D1% 81% D1% 81% D1% 8B% D0% BB% D0% BA% D0% B0 ที่หน้า] "name =" กรอบ№ 2 "> <กรอบ src =" http: // เว็บไซต์ / บทความ / 143778 /% 5B% D1% 81% D1% 81% D1% 8B% D0% BB% D0% BA% D0% B0 ที่หน้า] "name =" กรอบ№ 3 ">

แจ้งให้ทราบล่วงหน้าในตัวอย่างนี้สำหรับเฟรมที่สองและสามขนาดที่กำหนดเพียงครั้งเดียว

จำนวนมากของกระทะอนุญาตให้กรอบการทำงาน ตัวอย่างของตำแหน่งของพวกเขาในหน้าต่างเบราว์เซอร์สามารถนำอนันต์ (เหมาะสมเปลี่ยนรหัส) อย่างไรก็ตามการใช้ประโยชน์ของข้อมูลนี้จะไม่พบเป็นเวลานาน กรอบถ้าใช้วันนี้เพื่อสร้างเว็บไซต์ แต่เพียงในรูปแบบของโมดูลใน CMS ฟรีหรือ iframe ที่

กรอบลอย

ผมสงสัยว่าทำไมมันมีชื่อของที่นี่เป็นคำที่เหมาะสมมากขึ้น "ในตัว" เฟรมนี้ถูกออกแบบมาเพื่อแสดงเนื้อหาของแฟ้ม คุณอัปโหลดไปยังฐานข้อมูลเอกสารใด ๆ หรือไฟล์โดยใช้แท็ก ayfreyma กำหนดเส้นทางไป - และผู้เข้าชมจะเห็นแฟ้มข้อความ (วิดีโอหรือภาพ) แต่น่าเสียดายที่เบราว์เซอร์ไม่เคยสะท้อนให้เห็นถึงเนื้อหา สร้างเว็บนี้จะถูกป้อนระหว่างการเปิดและปิดวลี: "เบราว์เซอร์ของคุณไม่แสดงเนื้อหา."

ยกตัวอย่างเช่น Seopult.ru - บริการที่รู้จักจากต้นแบบที่จะก้าวไป ไม่เพียงเว็บไซต์หลักและกระจก I.seopult.pro สร้างขึ้นสำหรับลูกค้าพอร์ทัล รหัส ayfreyma จะจัดตั้งขึ้นในนาม:

  • คำแนะนำ ไหน
  • แท็กถูกออกแบบมาเพื่อตรวจสอบรายการสินค้า สนับสนุนโดยเบราว์เซอร์

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

    ทุกเว็บไซต์ที่สำคัญสำหรับการชมภาพยนตร์และรายการทีวีที่มีการสร้างขึ้นโดยใช้ ayfreymov (เช่น "Imhonet") เช่นเดียวกับเครือข่ายทางสังคม แม้ในหน้าแรกของ "Yandex" ที่มีแท็กนี้และไม่หนึ่งคู่

    วิธีการลงทะเบียน iframe

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

    และ ดังแสดงในตัวอย่างข้างต้นสามารถนำมาใช้และรายชื่อแท็ก -

  • ในแอตทริบิวต์เพิ่ม ayfreym:

    • ความกว้าง (กว้าง) และความสูง (height =);
    • สอดคล้องชิดขอบ;
    • padding ซึ่งไม่สามารถกำหนด: ค่าเริ่มต้นคือ 6 - นี้ค่อนข้างพอ;
    • โดยใช้ข้อมูลกรอบโปร่งใส allowtransparency คุณสามารถระบุได้ว่าคุณสามารถเห็นพื้นหลังของหน้านั้น
    • บวกคุ้นเคย SCR ชื่อเลื่อนชายแดน

    นำร่องใช้ ayfreyma

    ที่น่าสนใจที่สุดคือความสามารถในด้านของเฟรม - นี่คือการเขียนโค้ดที่ช่วยให้การเปิดเนื้อหาในหน้าต่างในการเชื่อมโยง - สิ่งที่ได้ผู้สร้างกระจก Seopult เท่านั้นที่มีหลายที่อ้างอิง (ทั้งที่มีอยู่ให้กับผู้ใช้ในหน้าเดียวกัน)

    สำหรับ ayfreym ดำเนินการนี้ก็ยังลงทะเบียนชื่อตามชื่อ = ยกตัวอย่างเช่น zagolovok นอกจากนี้ในด้านหน้าของเขาในแท็ก และการอ้างอิงที่กำหนดโดย href = http: // เว็บไซต์ / บทความ / 143778 /% D1% ระบุผลบังคับใช้ 81 หลังจากที่พวกเขาแอตทริบิวต์ target = zagolovok ก่อนที่คุณจะสามารถใช้แท็กปิดที่ระบุจารึกซึ่งจะทำหน้าที่เป็นปุ่มอ้างอิง แท็ก "และ" การเปิดและปิดอยู่ในแท็กพี

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

    รหัสจะมีลักษณะเช่นนี้

    โพสต์โฆษณาฟรี

    ดูโฆษณา