HTML 物件標籤-html教學-PHP中文網

HTML 物件標籤

WBOY

發布： 2024-09-04 16:20:07

原創

1090 人瀏覽過

HTML 外部資源的標籤指定一個容器。透過整合外部資源，在網頁中利用音訊、視訊、圖像、PDF 和 Flash 檔案等多媒體內容。與此標籤一起，標籤也用於描述不同的參數。與標籤

文法

HTML

<object data= "url " type= "content type ">
. . . . .
</object>

登入後複製

例如，

<object height= "200" width= "400" data= "url"> </object>

登入後複製

它顯示具有指定高度和寬度屬性的物件。

參數

物件標籤的參數為：

data：規定了物件將使用的資源URL。
type：指定資料描述的資源內容的類型。
form：表示與物件元素相關的表單元素。
高度：它提供物件的高度。
寬度：它提供物件的高度。
名稱：它提供物件的名稱。
類型必須符合：明確指出，如果類型屬性滿足資料屬性上提供的資源的適當文字類型，則應插入該資源。

HTML 物件標籤如何運作？

我們可以組合物件元素，並利用這種可能性，我們可以為每個瀏覽器定義多個物件。雖然所有主流瀏覽器都不支援 object 元素，但該元素的使用卻很少。

實作 HTML 物件標籤的範例

範例如下。

範例#1

代碼：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title> HTML Object Tag Example </title>
<style>
body {
background-color: #8FBC8F;
}
</style>
</head>
<body>
<center>
<h2> HTML Object Tag</h2> <br>
<object data= "https://www.shareasale.com/images/edu-logo.jpg" width="400px" height="200px"></object>
</center>
</body>
</html>

登入後複製

輸出：

HTML 物件標籤

說明：在上面的範例中，我們在網頁的中心使用

建立了物件標籤。標籤。物件元素以 400 像素高度和 200 像素寬度顯示。十六進位#8FBC8F代表HTML頁面主體的背景顏色。

範例#2

代碼：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title> HTML Object Tag Example </title>
<style>
body{
background-color: #8FBC8F;
}
</style>
</head>
<body>
<center>
<h2> HTML Object Tag</h2> <br>
<object height="200px" width="400px" data="https://www.youtube.com/embed/Xs3MCM0dXW0"></object>
</center>
</body>
</html>

登入後複製

輸出：

HTML 物件標籤

說明：在上面的範例中，我們透過使用 HTML 物件標籤以及高度和寬度屬性來嵌入視頻，這些屬性將影片設定在正確的位置。嵌入 YouTube 中的影片網址並貼上到資料屬性中。

範例#3

代碼：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title> HTML Object Tag Example </title>
<style>
body{
background-color: #8FBC8F;
}
</style>
</head>
<body>
<center>
<h2> HTML Object Tag</h2> <br>
<object data= "https://www.shareasale.com/images/edu-logo.jpg" width="400px" height="200px" vspace="150"></object>
</center>
</body>
</html>

登入後複製

輸出：

HTML 物件標籤

說明：在上面的範例中，我們使用了物件標籤在網頁上顯示圖像。 object 標籤使用 vspace 屬性定義物件元素頂部和底部的空白。在這裡，我們將頂部和底部的邊距設定為 150 像素。

範例#4

代碼：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title> HTML Object Tag Example </title>
<style>
body{
background-color: #8FBC8F;
}
</style>
</head>
<body>
<center>
<h2> HTML Object Tag</h2> <br>
<object data= "https://www.shareasale.com/images/edu-logo.jpg" width="400px" height="200px" border="8"></object>
</center>
</body>
</html>

登入後複製

輸出：

HTML 物件標籤