Audio, Video & Semantics Tags in HTML
I am Learning MERN Stack for developing Web & hybrid Mobile Application.
I am learning currently on Frontend technologies (HTML5, CSS3, Tailwind, Javascript, and other JS libraries) and will learn Backend technologies (Mongo DB & Node JS) in a span of 6 months with great projects, keep an eye on my profile for updates.
I am also skillful in C, C++ Java and Data Structures & Algorithms.
Aspiring for a challenging career in Software Development as to use my learned skills and experience for best results.
Audio Tag
HTML provides a new standard for inserting an audio file on your web page. You can embed an audio file to your page using the <audio> element:
2: Video
You can embed also a video to a webpage using the <video> element:
3: Using <video> and <audio> element to display audio/video content
Use the HTML <video> or <audio> element to embed video/audio content in a document. The video/audio element contains one or more video/audio sources. To specify a source, use either the src attribute or the <source> element; the browser will choose the most suitable one.
Video tag example:
Audio Tag Example:
IFRAME
The tag IFRAME is extremely simple. The syntax to make it work is:-
<IFRAME SRC="FileName"></IFRAME>
Note that though it has both a start and end tag, it has no content. You can write something or insert images if you want to. That will just be shown below the content being linked to in the SRC attribute.
Using IFrames
If we try inserting the a youtube video in 560 x 315 px IFRAME, then the code & the result will looks like this:
Thank You!
for reading the article, I hope you found it informative and helpful in understanding the Audio and Video Elements in HTML.
I hope this article provided you with a solid foundation to start building web pages using HTML. Stay tuned for more articles where we will discuss CSS and Javascript in our upcoming articles, which are essential to building a rock-solid foundation in development.
If you have any further questions or need clarification on any topic discussed in the article, please feel free to ask. Happy coding and best of luck with your web development journey!
