เนื้อหามัลติมีเดียและการฝังมีบทบาทสำคัญในการเพิ่มเสน่ห์ทางสายตาและการโต้ตอบของหน้าเว็บ ต่อไปนี้เป็นรายละเอียดเพิ่มเติมและตัวอย่างเฉพาะเกี่ยวกับวิธีใช้มัลติมีเดียและฝังเนื้อหาใน HTML
รูปภาพ
หากต้องการแสดงรูปภาพบนหน้าเว็บ ให้ใช้ <img>
แท็ก ระบุแหล่งที่มาของรูปภาพโดยใช้ src
แอตทริบิวต์ และระบุข้อความแสดงแทนโดยใช้ alt
แอตทริบิวต์สำหรับการเข้าถึง
นี่คือตัวอย่าง:
<img src="image.jpg" alt="A beautiful sunset">
เครื่องเสียง
หากต้องการฝังไฟล์เสียง ให้ใช้ <audio>
แท็ก ระบุแหล่งที่มาของเสียงโดยใช้ src
แอตทริบิวต์ และคุณสามารถเพิ่มการควบคุมสำหรับการเล่นโดยใช้ controls
แอตทริบิวต์
นี่คือตัวอย่าง:
<audio src="audio.mp3" controls></audio>
วิดีโอ
สำหรับการฝังวิดีโอ ใช้ <video>
แท็ก ตั้งค่าแหล่งที่มาของวิดีโอโดยใช้ src
แอตทริบิวต์ และรวม controls
แอตทริบิวต์สำหรับการควบคุมการเล่นวิดีโอ
นี่คือตัวอย่าง:
<video src="video.mp4" controls></video>
แผนที่
หากต้องการฝังแผนที่จากบริการต่างๆ เช่น Google Maps ให้ใช้ <iframe>
แท็กและใส่รหัสฝังแผนที่ที่ให้บริการ
นี่คือตัวอย่าง:
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3024..." width="600" height="450" frameborder="0" style="border:0;" allowfullscreen="" aria-hidden="false" tabindex="0"></iframe>
เว็บแอพพลิเคชั่น
หากต้องการฝังเว็บแอปพลิเคชันหรือเว็บไซต์ภายนอก ให้ใช้ <iframe>
แท็กอีกครั้งและระบุ URL ของเว็บแอปพลิเคชัน
นี่คือตัวอย่าง:
<iframe src="https://www.example.com" width="800" height="600" frameborder="0"></iframe>
ตัวอย่างเหล่านี้แสดงวิธีฝังมัลติมีเดียและเนื้อหาภายนอกประเภทต่างๆ ลงในหน้า HTML ของคุณ ตรวจสอบให้แน่ใจว่าได้ปรับแอตทริบิวต์และขนาดตามที่จำเป็นเพื่อให้แน่ใจว่ามีการแสดงผลและการทำงานที่เหมาะสม