HTML 中的嵌入標籤的目的是用於顯示外部資源或應用程式。這主要用於多媒體內容,例如將視訊檔案或音訊檔案顯示到我們的 HTML 應用程式中。此標籤也用於導入 Flash 動畫師等插件。該標籤是在 HTML 5 版本中引入的。它確實有結束標籤,如
等。等等
即時範例:我們已經看到很多網站在這些網站中包含媒體檔案。不支援普通標籤顯示媒體檔案。因此,我們在 HTML 中為所有類型的媒體檔案使用了嵌入標籤。
注意:此標籤也用於包含圖片和外部 html 檔案。
嵌入標籤在 Html 中如何運作?
HTML 嵌入工作是基於 4 個屬性。這些屬性指定嵌入必須執行的操作。
文法:
<embed Required attributes>
登入後複製
必需屬性:
1。 height: 這些屬性用來指定嵌入內容元素的高度。該值以像素為單位。
文法:
<embed height="value in pixels">
登入後複製
2。 width: 這些屬性用來指定嵌入內容元素的寬度。該值以像素為單位。
文法:
<embed width="value in pixels">
登入後複製
3。 src: 用於攜帶網址,即用於指定嵌入內容的網址。
文法:
<embed src="web URL">
登入後複製
4。 type: 此屬性用於指定媒體類型,如視訊或音訊。
文法:
<embed type="type of media">
登入後複製
在 HTML 中嵌入標籤的範例
以下是下面提到的範例:
範例 #1 – 嵌入影像
代碼:
<!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>
登入後複製
輸出:
範例 #2 – 嵌入其他 html 資源
HTML 程式碼: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 程式碼: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>
登入後複製
輸出:
範例 #3 – 嵌入影片檔
代碼:
<!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>
登入後複製
輸出:
結論
嵌入 HTML 用於將視訊和音訊檔案包含到我們的 HTML 應用程式中。可以使用高度和寬度屬性根據我們的要求調整此外部嵌入資源的大小。