html图像标签自带的属性，html5新增属性和标签

HTML图像标签是常用的标签之一，每个标签都包含着一些特有属性，而HTML5为图像标签增加了一些新的属性和标签，让我们一起来了解。

**1. HTML图像标签自带属性**

HTML图像标签``是用于插入图像的标签，它的自带属性如下：

- `src`：指定图像的路径，可以是相对路径或绝对路径。

- `alt`：指定图像的替代文本，当图像无法显示时，替代文本将显示在页面上。

- `width`：指定图像的宽度，可以是像素值或百分比。

- `height`：指定图像的高度，可以是像素值或百分比。

- `title`：指定图像的标题，当鼠标指向图像时，标题文本将显示在屏幕上。

- `longdesc`：指定图像的详细描述信息的URL地址。

- `ismap`：指定图像是否是一个图像映射（image map）。

例如：

```html

```

上面的代码中，`src`属性指定了图片的路径，`alt`属性指定了图片的替代文本，`width`和`height`属性分别指定了图片的宽度和高度。

**2. HTML5新增属性**

HTML5为图像标签增加了以下属性：

- `crossorigin`：指定图像跨域访问的权限。

- `loading`：指定图像的加载模式。

- `referrerpolicy`：指定图像的引用策略。

其中，`crossorigin`属性的取值可以为`anonymous`、`use-credentials`或空字符串，分别表示匿名访问、使用凭证访问和默认策略。例如：

```html

```

上面的代码中，`crossorigin`属性指定了图片的跨域访问权限为匿名访问。

`loading`属性的取值可以为`eager`、`lazy`或默认值`auto`，分别表示立即加载、延迟加载和根据浏览器的默认行为加载。例如：

```html

```

上面的代码中，`loading`属性指定了图片的加载模式为延迟加载。

`referrerpolicy`属性的取值可以为`no-referrer`、`no-referrer-when-downgrade`、`origin`、`origin-when-cross-origin`、`same-origin`、`strict-origin`、`strict-origin-when-cross-origin`或`unsafe-url`，分别表示不发送引用信息、仅在协议升级时发送、仅使用请求URL的源作为引用信息发送、仅在同源请求时发送、仅使用请求URL的源作为引用信息发送且仅在同源请求时发送、仅使用请求URL的源和端口作为引用信息发送且仅在同源请求时发送、仅使用请求URL的源和端口作为引用信息发送或发送全部信息。例如：

```html

```

上面的代码中，`referrerpolicy`属性指定了图片的引用策略为不发送引用信息。

**3. HTML5新增标签**

HTML5还为图像标签增加了一个新标签``，它可以将多个不同大小和格式的图片组合成一个响应式的图片，以便根据设备屏幕的大小和分辨率选择最佳的图片。例如：

```html

```

上面的代码中，``标签包含三个元素：``标签用于指定不同格式和尺寸的图片，``标签用于指定默认的图片，`type`属性用于指定图片的类型，`srcset`属性用于指定不同分辨率的图片路径，`media`属性用于指定图片的显示条件。

综上所述，HTML图像标签自带属性和HTML5新增属性和标签让我们在开发过程中更便捷、简单化。 如果你喜欢我们三七知识分享网站的文章， 欢迎您分享或收藏知识分享网站文章 欢迎您到我们的网站逛逛喔！https://www.37seo.cn/