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 对象标签