HTML5之图片标签

图片标签：用于向当前页面中引入一个外部图片

        使用img标签来引入外部图片，img标签是一个自结束标签

        img属于替换元素（介于块元素和行内元素之间,具有两种元素的特点）

（1）属性：

        -src 指定的是外部图片的路径（路径规则与超链接一致）

         -alt 对图片的描述，这个描述默认情况下不显示，有些浏览器会在图片无法加载时显示

             搜索引擎会根据alt中的内容来识别图片，若不写alt属性则图片不会被搜索引擎所收录

        -width 图片的宽度 （单位是像素）

        -height 图片的高度

             宽度和高度如果只修改了一个，则另一个会等比例缩放。

【注】一般情况下，在pc端，不建议修改图片的大小。

           但在移动端，经常需要对图片进行缩放（主要是大图缩小）。

（2）图片的格式：

        -jpeg（jpg）：支持的颜色比较丰富，不支持透明效果，不支持动图

                  一般用来显示照片

        -gif：支持的颜色比较少，支持简单透明，支持动图

                 适合颜色单一的图片，动图

        -png：支持的颜色丰富，支持复杂透明，不支持动图

                 颜色丰富，复杂透明的图（专为网页而生）

        -webp：谷歌新推出的，专门用来表示网页中的图片的一种格式

                 具备了其他图片格式的所有优点，而且文件还特别小

                 缺点：兼容性不好

        -base64：将图片使用base64编码，这样可以将图片转换为字符

                通过字符的形式来引入图片

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

        【注】效果一样用占内存小的，效果不一样用效果好的