วิธีการจัด iFrame ให้อยู่ตรงกลาง

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

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

อันดับแรก เราจะอธิบายในเชิงลึกว่า iFrame คืออะไร และเหตุใดคุณจึงต้องการตั้งให้อยู่ตรงกลาง จากนั้น เราจะครอบคลุมพื้นฐานบางอย่างเกี่ยวกับ HTML และวิธีที่พวกเขาใช้ iFrames สุดท้าย เราจะแนะนำคุณตลอดขั้นตอนการจัด iFrame ให้อยู่กึ่งกลางบนหน้าเว็บของคุณโดยใช้แอตทริบิวต์ align

iFrame คืออะไร?

iFrame เป็นคำย่อสำหรับ Inline Frame Inline Frames เป็นองค์ประกอบ HTML ที่สามารถแสดง องค์ประกอบ HTML อื่นๆ รวมทั้งโค้ดจากเว็บไซต์อื่นๆ เช่น Facebook หรือ YouTube พูดง่ายๆ หน่อยว่า iFrame คือหน้าต่างภายในหน้าเว็บที่ช่วยให้คุณสามารถดูเนื้อหาจากหน้าเว็บอื่นได้ iFrames เป็นวิธีที่ยอดเยี่ยมในการรวมบางสิ่งเข้ากับหน้าเว็บของคุณอย่างรวดเร็วและง่ายดาย แม้ว่าพวกเขาต้องการความรู้ HTML แต่ก็สามารถเป็นวิธีที่ง่ายมากในการปรับปรุงหน้าเว็บของคุณ โดยเฉพาะธุรกิจสามารถได้รับประโยชน์จากการใช้ iFrames ภายในเว็บไซต์ของตน iFrames แทนลิงก์หรือภาพนิ่งสามารถทำให้เว็บไซต์ธุรกิจของคุณดูเป็นมืออาชีพมากขึ้น พวกเขาสามารถเป็นแหล่งรายได้ได้หากใช้เพื่อแสดงโฆษณาจากธุรกิจอื่น

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

เหตุใดฉันจึงต้องการใช้ iFrame บนเว็บเพจของฉัน

iFrames ปรับปรุงลักษณะโดยรวมของหน้าเว็บของคุณโดยให้ผู้ใช้เข้าถึงเนื้อหาได้โดยตรง ตัวอย่างเช่น วิดีโอ YouTube ที่ฝังโดยใช้ iFrames จะเล่นโดยตรงบนหน้าเว็บ ไม่จำเป็นต้องรอให้หน้าเว็บตามลิงก์หรือค้นหาวิดีโอ วิธีนี้ทำให้ผู้อ่านสามารถชมวิดีโอได้โดยไม่ต้องออกจากเพจ นอกจากนี้ยังช่วยลดเวลาในการโหลดด้วยการใส่วิดีโอเป็นหน้าในหน้าของคุณ เวลาที่ใช้ในการโหลดหน้าอาจ ส่งผลต่อปริมาณการเข้าชมเว็บไซต์ อย่างมาก

การฝังสิ่งต่างๆ เช่น Google Maps สามารถบอกเส้นทางได้อย่างง่ายดายโดยไม่ต้องค้นหา เนื่องจาก iFrames เข้าถึงหน้าเว็บอื่นๆ โดยตรง คำแนะนำจึงเป็นปัจจุบันเสมอ ซึ่งอาจเป็นส่วนเสริมที่เป็นประโยชน์สำหรับหน้าเว็บใดๆ ที่เน้นที่สถานที่เฉพาะ เช่น บทความเกี่ยวกับสถานที่ท่องเที่ยว ในทำนองเดียวกัน ธุรกิจอาจต้องการใส่ หมุดของที่อยู่ใน Google Maps บนเว็บไซต์ การใช้ iFrame ของ Google แผนที่ทำให้ผู้เข้าชมมีตัวเลือกในการดึงข้อมูลเส้นทางได้อย่างรวดเร็วโดยคลิกที่ iFrame

จัดศูนย์ iFrame

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

iFrame HTML

HTML หรือ Hypertext Markup Language คือข้อมูลที่บอกเว็บเบราว์เซอร์ถึงวิธีแสดงหน้าเฉพาะของเว็บไซต์ ประกอบด้วยชุดโค้ดยาวๆ ที่สามารถแก้ไขและเปลี่ยนแปลงได้โดยการเพิ่มหรือลบส่วนต่างๆ ของโค้ด การเปลี่ยนแปลงเหล่านี้ส่งผลต่อวิธีการแสดงหน้าเว็บและการทำงานของหน้าเว็บ

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

การแก้ไขโค้ด HTML ของเว็บไซต์จะเปลี่ยนรูปลักษณ์และฟังก์ชัน การแก้ไข HTML อาจเกี่ยวข้องกับโปรแกรมแก้ไข HTML เช่น NotePad หรือ KompoZer ในโปรแกรมแก้ไขเหล่านี้ คุณสามารถเปลี่ยนแปลง HTML ได้โดยแก้ไขโค้ดโดยตรง นี่เป็นวิธีที่ยอดเยี่ยมในการสร้างหรือพัฒนาเว็บไซต์ของคุณหากคุณเชี่ยวชาญด้านเทคโนโลยีเป็นพิเศษ การแก้ไข HTML ด้วยตนเองทำให้คุณสามารถ รวมรูปภาพ เปลี่ยนข้อความ และรวม iFrames ได้

การใช้ iFrame บนเว็บไซต์ของคุณ

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

สำหรับเนื้อหาประเภทอื่น การใช้ลิงก์ไปยังเว็บไซต์ภายใน HTML ของคุณอาจง่ายกว่า หากต้องการรวม iFrame ประเภทนี้ในเว็บไซต์ของคุณ ให้เริ่มต้นด้วยการเปิดโปรแกรมแก้ไข HTML ที่คุณต้องการ ในตัวแก้ไขของคุณ ให้ค้นหาโค้ดที่คุณต้องการเพิ่ม iFrame ของคุณ เริ่มต้นด้วยการพิมพ์ “<iframe src=” “src” ในที่นี้หมายถึงแหล่งที่มา ดังนั้นสิ่งต่อไปนี้ควรเป็นแหล่งที่มาของเนื้อหาที่แสดงใน iFrame นี่คือที่ที่คุณต้องการคัดลอกและวางลิงก์ไปยังเนื้อหาที่คุณต้องการแสดง ลิงก์ควรอยู่ในเครื่องหมายคำพูดที่สิ้นสุดที่ลิงก์

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

iFrame Align Center

การจัด iFrame ให้อยู่ตรงกลางเป็นส่วนสำคัญของรูปลักษณ์ของหน้าเว็บของคุณ ความพยายามในการสร้าง iFrame อาจเป็นเรื่องน่าหงุดหงิดอย่างเหลือเชื่อ เพียงแต่ต้องปิดลงเล็กน้อยเท่านั้น โชคดีที่การจัด iFrame ให้อยู่ตรงกลางนั้นง่ายกว่าการสร้างใหม่ตั้งแต่ต้น! เช่นเดียวกับการสร้าง iFrame คุณต้องแก้ไข HTML ของคุณ

เปิดตัวแก้ไข HTML ของคุณ และค้นหา iFrame ที่คุณต้องการให้อยู่ตรงกลาง ภายในโค้ดสำหรับ iFrame นั้น ให้พิมพ์ “align=center” การดำเนินการนี้จะบอกให้เพจของคุณจัด iFrame ให้อยู่ตรงกลาง คุณยังสามารถจัดกึ่งกลางรูปภาพโดยแก้ไขความสูงและความกว้างของรูปภาพในหน้า อีกครั้ง สิ่งเหล่านี้สามารถวัดได้เป็นพิกเซลหรือเปอร์เซ็นต์

คุณยังสามารถจัดแนว iFrame ของคุณให้แตกต่างออกไปได้ หากคุณไม่ต้องการให้มันอยู่ตรงกลาง แทนที่จะพิมพ์ตรงกลาง ให้พิมพ์ "left", "right", "bottom" หรือ "top" หลัง "align=" iFrame ของคุณจะถูกวางตามข้อความนี้ เครื่องมือที่ใช้สำหรับสิ่งนี้เรียกว่า "แอตทริบิวต์จัดตำแหน่ง" แอตทริบิวต์ align ทำให้การเปลี่ยนตำแหน่งของ iFrame ของคุณตรงไปตรงมามาก แม้ว่าการวาง iFrames ให้อยู่ตรงกลางนั้นยอดเยี่ยมสำหรับเนื้อหาที่สำคัญ แต่ iFrame บางตัวเช่น iFrame ที่ใช้แสดงโฆษณาอาจเหมาะกับด้านข้างของหน้าเว็บมากกว่า

การจัดศูนย์ iFrames

iFrames เป็นวิธีที่ยอดเยี่ยมในการผสมผสานเนื้อหาเข้ากับเว็บไซต์ของคุณ แต่การทำให้เว็บไซต์ดูเหมาะสมอาจเป็นเรื่องยาก เพียงเปิดโค้ด iFrames และเพิ่ม "align=center" ให้กับองค์ประกอบ ตอนนี้คุณสามารถควบคุมวิธีที่หน้าเว็บของคุณแสดงเนื้อหาได้มากขึ้น เนื้อหาที่แสดงใน iFrames สามารถปรับปรุงรูปลักษณ์และฟังก์ชันโดยรวมของหน้าเว็บของคุณได้อย่างมาก เนื่องจาก iFrames ทำหน้าที่เป็นหน้าต่างสู่ข้อมูลของเว็บไซต์อื่น หน้าเว็บของคุณสามารถใส่ข้อมูลสำคัญทุกประเภทไว้ในที่เดียว โฆษณา วิดีโอ และแผนที่ทั้งหมดสามารถเพิ่มลงในหน้าเว็บของคุณผ่าน HTML ได้อย่างง่ายดาย

คำถามที่พบบ่อย:

• iFrame คืออะไร?
• จะจัด iFrame ให้อยู่ตรงกลางได้อย่างไร
• HTML คืออะไร?
• ฉันจะวางโค้ดที่ฝังไว้ตรงกลางได้อย่างไร
• คุณจัดตำแหน่งกึ่งกลางใน HTML ได้อย่างไร

กระทู้ที่เกี่ยวข้อง:

XML Sitemaps: ทุกสิ่งที่คุณจำเป็นต้องรู้ วิธีการเลือกที่ปรึกษาการพัฒนาเว็บไซต์ที่ดีที่สุด เว็บไซต์สมาชิกคืออะไร? วิธีแก้ไขข้อผิดพลาดการติดตั้ง PHP