html-图片标签、格式(7)_html image支持的图片格式-CSDN博客

本文链接：https://blog.csdn.net/qq_45255696/article/details/114786314

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!--
        使用img标签来引入外部图片，img是一个自结束标签
        img属于替换元素
        属性:
        src 属性指定的是外部图片的路径(路径规则和超链接是一样的)
        alt 图片的描述,这个描述默认情况下不会显示，有些浏览器照片无法加载时显示
            搜索引擎会根据alt中的内容来识别照片，如果不写alt属性则图片不会被搜索引擎所收录
        
        width 图片的宽度(单位像素)
        height 图片的高度
        -宽度和高度中修改其中一个，另一个会等比例缩放

    -->
    <img src="" alt="" width="">


    <!--
        图片的格式:
        jpg
            -支持的颜色比较丰富，不支持透明效果，不支持动图
            -一般用来显示照片

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

        png
            -支持的颜色丰富，支持复杂透明，不支持动图
            -颜色丰富，复杂透明图片（专为网页而生）

        webp
            -具备其他图片格式的所有优点，而且文件还特别小
            -缺点:兼容性不好

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

        效果一样，用小的
        效果不一样，用效果好的
        

    -->


</body>
</html>