1、img元素是什么？

img元素，顾名思义就是图像嵌入元素。

2、它包含属性

alt
:定义了图像的备用文本描述

crossorigin
:这个枚举属性表明是否使用CORS完成相关图像的抓取。（CORS是跨源域资源共享，它允许Web应用服务器进行跨源访问控制，从而使跨源数据传输得以安全进行）

它允许的值有：

anonymous:执行一个跨域请求，但是没有发送证书。

use-credentials:一个有证书的跨域请求被发送。

实例：

<!DOCTYPE html>
<head>demo</head>
<body>
    <imgsrc="D:\vs\Rcode\images\Beijing.jpg"alt="Beijing"crossorigin="anonymous">
</body>

这个时候，我们会发现这张图片没有办法显示出来。

decoding
:为浏览器提供图像解码方式上的提示。

height
:图像的高度，单位是CSS像素，可以指定width和height中的一个值，浏览器会根据原始图像进行缩放。（这个东西我们后面直接用CSS进行表示了）

importance
:指示下载资源时相对优先级。它允许的值为：

-auto:不指定优先级，浏览器可以使用自己的算法来为图像选择优先级。

-high:此图像在下载时优先级较高

-low:此图像在下载时优先级较低

ismap:
这个布尔属性表示图像是否时服务器map的一部分，如果是，那么点击图片的精准坐标将会被发送到服务器。

loading
:指示浏览器应当如何加载该图像，它允许的值为：

-eager:立即加载图像，不管他是否在可视窗口之外

-lazy:延迟加载图像，直到它和视图接近到一个计算得到的距离

(上面这一段是说如果我们一张图片的loading值设置为eager,那么我们无论是否已经划到该图片能被看到的页面，这张图片都会被加载，但是我们设置的为lazy的话，就等到我们划到能看到它了才开始加载）

src
:图像的url

title
:表示鼠标在图片上停留时，显示一个悬浮框，其中显示的文字。

例子：

<imgsrc="D:\vs\Rcode\images\spring.jpg"title="spring"> 

标签: none

添加新评论