เนื้อหามัลติมีเดียและการฝัง: ควบคุมพลังของสื่อใน HTML

เนื้อหามัลติมีเดียและการฝังมีบทบาทสำคัญในการเพิ่มเสน่ห์ทางสายตาและการโต้ตอบของหน้าเว็บ ต่อไปนี้เป็นรายละเอียดเพิ่มเติมและตัวอย่างเฉพาะเกี่ยวกับวิธีใช้มัลติมีเดียและฝังเนื้อหาใน 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 ของคุณ ตรวจสอบให้แน่ใจว่าได้ปรับแอตทริบิวต์และขนาดตามที่จำเป็นเพื่อให้แน่ใจว่ามีการแสดงผลและการทำงานที่เหมาะสม