Home >Web Front-end >HTML Tutorial >Embed Tag in HTML

Embed Tag in HTML

WBOY
WBOYOriginal
2024-09-04 16:32:27794browse

The Embed Tag in HTML purpose is for displaying external resources or applications. This is used mostly in multimedia content like showing video files or audio files into our HTML application. This tag is also used for importing plug-ins like flash animators. This tag is introduced in HTML 5 version. It does have ending tag as like

, , , etc.

Real-Time Example: We have seen so many websites contains media files within those websites. A normal tag is not supported to display media files. So we have used an embed tag for all types of media files in HTML.

Note: This tag also used for including images and external html files.

How Does Embed Tag Work in Html?

HTML embed work based on 4 attributes. These attributes specify what embed has to do.

Syntax:

<embed Required attributes>

Required attributes: The tag allows attributes in any HTML document.

1. height: These attributes used to specify the height of the embedded content element. This value is in pixels.

Syntax:

<embed height="value in pixels">

2. width: These attributes used to specify the width of the embedded content element. This value is in pixels.

Syntax:

<embed width="value in pixels">

3. src: It is used to carry the web URL, which means used to specify the web address of the embedded content.

Syntax:

<embed src="web URL">

4. type: This attribute is used to specify the type of media like video or audio.

Syntax:

<embed type="type of media">

Examples of Embed Tag in HTML

Here are the following examples mention below:

Example #1 – embed with image

Code:

<!DOCTYPE html>
<html>
<title>embed attribute</title>
<head>
<!-- CSS Code -->
<style>
p {
color: red;
border: 2px solid green;
font-size: 22px;
}
h1 {
color: orange;
text-align: center;
}
</style>
</head>
<body>
<h1>The embed tag introduction</h1>
<p>
The
<embed>
tag in HTML purpose is for displaying external resources or
applications. This is used mostly in multimedia content like showing
video files or audio files into out HTML application. This embed tag
is also used for importing plug-ins like flash animators. This embed
tag is introduced in HTML 5 version. It does have ending tag as like p
tag, <html>, <body>, <a> etc.
</p>
<p>Real Time Example: We have seen so many website contains media
files within that websites. Normal tag are not supported to display
media files. So we have used embed tag for all types of media files in
HTML.</p>
<h1>The embed tag Example</h1>
<embed src="d6.jpg" width="400" height="400">
</body>
</html>

Output:

Embed Tag in HTML

Example #2 – Embed with other html resources

HTML Code: EmbedResource.html

<!DOCTYPE html>
<html>
<title>embed attribute</title>
<body>
<!-- Embed content from other html file -->
<embed src="Resource.html" width="1000" height="200">
</body>
</html>

HTML Code: Resource.html

<!DOCTYPE html>
<html>
<title>embed attribute</title>
<head>
<!-- CSS Code -->
<style>
p {
color: brown;
border: 2px ridge navy;
font-size: 22px;
}
h1 {
color: blue;
text-align: center;
}
</style>
</head>
<body>
<h1>The embed tag introduction</h1>
<p>
The
<embed>
tag in HTML purpose is for displaying external resources or
applications. This is used mostly in multimedia content like showing
video files or audio files into out HTML application. This embed tag
is also used for importing plug-ins like flash animators. This embed
tag is introduced in HTML 5 version. It does have ending tag as like p
tag, <html>, <body>, <a> etc.
</p>
<p>Real Time Example: We have seen so many website contains media
files within that websites. Normal tag are not supported to display
media files. So we have used embed tag for all types of media files in
HTML.</p>
</body>
</html>

Output:

Embed Tag in HTML

Embed Tag in HTML

Example #3 – Embed with the video file

Code:

<!DOCTYPE html>
<html>
<title>embed attribute</title>
<head>
<!-- CSS Code -->
<style>
p {
color: brown;
border: 2px ridge navy;
font-size: 22px;
}
h1 {
color: blue;
text-align: center;
}
</style>
</head>
<body>
<h1>The embed tag introduction</h1>
<p>
The
<embed>
tag in HTML purpose is for displaying external resources or
applications. This is used mostly in multimedia content like showing
video files or audio files into out HTML application. This embed tag
is also used for importing plug-ins like flash animators. This embed
tag is introduced in HTML 5 version. It does have ending tag as like p
tag, <html>, <body>, <a> etc.
</p>
<p>Real Time Example: We have seen so many website contains media
files within that websites. Normal tag are not supported to display
media files. So we have used embed tag for all types of media files in
HTML.</p>
<!-- Embed content from other video file -->
<embed src="nationalgeography.mp4" width="400" height="300">
</body>
</html>

Output:

Embed Tag in HTML

Embed Tag in HTML

Conclusion

Embed in HTML is used for including video and audio files into our HTML application. This external embed resource can be resized as per our requirement by using height and width attributes.

The above is the detailed content of Embed Tag in HTML. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article:tfoot in HTMLNext article:tfoot in HTML