Embedded Files
HTML Multimedia
HTML Multimedia
Multimedia on the web is image, sound, music, videos, movies, and animations.
What is Multimedia?
What is Multimedia?
Multimedia comes in many different formats. It can be almost anything you can hear or see, like images, music, sound, videos, records, films, animations, and more.
Web pages often contain multimedia elements of different types and formats.
HTML Images
HTML Images
Images can improve the design and the appearance of a web page.
Syntax
Syntax
<img src="url" alt="alternatetext">
Example
Example
<img src="pic_trulli.jpg" alt="Italian Trulli">
<img src="img_chania.jpg" alt="Flowers in Chania">
<img src="img_girl.jpg" alt="Girl in a jacket" style="width:500px;height:600px;">
HTML Video
HTML Video
The HTML <video> element is used to show a video on a web page.
HTML Video - Media Types
HTML Video - Media Types
File Format Media Type
MP4 video/mp4
WebM video/webm
Ogg video/ogg
Example
Example
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
HTML Audio
HTML Audio
The HTML <audio> element is used to play an audio file on a web page.
HTML Audio Types
HTML Audio Types
File Format Media Type
MP3 audio/mpeg
OGG audio/ogg
WAV audio/wav
Example
Example
<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
HTML YouTube Videos
HTML YouTube Videos
The easiest way to play videos in HTML, is to use YouTube.
Example
Example
<iframe width="420" height="315"
src="https://www.youtube.com/embed/tgbNymZ7vqY">
</iframe>
Active 4 : HTML Media
Active 4 : HTML Media
ให้นักเรียนแทรก Media ดังนี้
1. ภาพนิ่ง 2 ภาพ
2. แทรกไฟล์วีดีโอ ประเภท mp4 จำนวน 1 ไฟล์
3. แทรกไฟล์เสียง ประเภท mp3 จำนวน 1 ไฟล์
4. แทรกไฟล์จาก Youtube จำนวน 1 คลิป
เกณฑ์การให้คะแนน
เกณฑ์การให้คะแนน
1. ไม่ปฏิบัติกิจกรรมใดเลย 0 คะแนน
2. ปฏิบัติโดยให้ได้รับการช่วยเหลือจากครูผู้สอน 5 คะแนน
3. ปฏิบัติโดยได้รับการช่วยเหลือจากเพื่อน 8 คะแนน
4. ปฏิบัติด้วยตนเอง 10 คะแนน
Page updated
Report abuse