Embed Tag in HTML-HTML Tutorial-php.cn

Table of Contents

How Does Embed Tag Work in Html?

Examples of Embed Tag in HTML

Example #1 – embed with image

Example #2 – Embed with other html resources

Example #3 – Embed with the video file

Conclusion

Home

Web Front-end

HTML Tutorial

Embed Tag in HTML

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Sep 04, 2024 pm 04:32 PM

html html5 HTML Tutorial HTML Properties HTML tags

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:

1	`<embed Required attributes>`

Copy after login

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:

1	`<embed height="value in pixels">`

Copy after login

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

Syntax:

1	`<embed width="value in pixels">`

Copy after login

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

Syntax:

1	`<embed src="web URL">`

Copy after login

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

Syntax:

1	`<embed type="type of media">`

Copy after login

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>

Copy after login

Output:

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>

Copy after login

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>

Copy after login

Output:

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>

Copy after login

Output:

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 of this Website

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