Bootstrap

标签:img

作用: 使用img标签来向网页中引入一个外部图片,img标签也是一个自结束标签。

属性:

1. src 引入图片的路径

2. alt 对图片的描述,帮助浏览器收录图片,有一定的seo效果

3. width 控制图片的宽度

4. height 控制图片的高度

注意:1.一般不会同时设置宽高

2. img标签是行内块元素 ,自结束标签

不同的图片格式特性不一样,使用场合也有所不同。

图片的格式

JPEG(JPG)

- JPEG图片支持的颜色比较多,图片可以压缩,但是不支持透明

- 一般用来保存照片等颜色丰富的图片

GIF

- GIF支持的颜色少,只支持简单的透明,支持动态图

- 图片颜色单一或者是动态图时可以使用gif

PNG

- PNG支持的颜色多,并且支持复杂的透明,不支持动图

- 可以用来显示颜色复杂的透明的图片

专为网页而生的

webp

-谷歌新推出的专门用来表示网页的一种格式

-它具有其他图片格式的所有优点,而且文件格式还很小

-缺点:兼容性不好

base64

-讲图片使用base64编码,这样可以将图片转换为字符,通过字符形式来引入

-一般都是需要和网页一起加载的图片才会使用base64

图片的使用原则:

效果不一致,使用效果好的

效果一致,使用小的

-->

<!-- 网页加载流程

先加载网页结构,然后再加载外部的资源包括css文件,js文件,图片,各种插件等

;