0006-图片标签

最新推荐文章于 2024-10-27 15:17:53 发布

Lynan、

最新推荐文章于 2024-10-27 15:17:53 发布

阅读量171

点赞数

分类专栏：前端HTML5 文章标签： html5 html

本文链接：https://blog.csdn.net/JL_xcly/article/details/122886237

版权

前端HTML5 专栏收录该内容

34 篇文章 0 订阅

订阅专栏

图片标签的路径

<!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>图片标签的路径</title>
</head>
<body>
    <!-- 同级目录
         1.01.jpg
         2../01.jpg
         3.返回上一级../,再进入保存图片的文件夹
         4.返回多级../../
    -->
    <img src="../img/01.jpg">
</body>
</html>

图片标签的属性

<!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>图片标签的属性</title>
</head>
<body>
     <img src="../img/001.jpg" alt="前后端的区别，请尝试刷新页面。">
     <!-- 图片加载出错后显示alt的内容 -->
     <img src="../img/01.jpg" title="这张图片描述了前后端的区别">
     <!-- 把鼠标移入之后就能显示title的内容 -->
     <img src="../img/01.jpg" width="200px" height="200px">
     <!-- 改变图片的宽高 -->
</body>
</html>