【HTML】3_图像标签与路径
【摘要】 5、图像标签使用img标签需要些别的属性，例如：src属性为图片地址，这里实例中的图片使用的是本地文件，相对路径alt标签是在图片加载不出来时，出现的提示文字，提示我们这个图片原本是什么的，加入我图片地址写错的话，alt标签就会发挥作用，如图title标签是当我鼠标悬停，放在图片上时显示的文字，如图我们还能自定义图片的大小，可以添加width宽度属性，或者高度hight属性，当然两者应该选...
5、图像标签
使用img标签
需要些别的属性，例如：src属性为图片地址，这里实例中的图片使用的是本地文件，相对路径
alt标签是在图片加载不出来时，出现的提示文字，提示我们这个图片原本是什么的，加入我图片地址写错的话，alt标签就会发挥作用，如图
title标签是当我鼠标悬停，放在图片上时显示的文字，如图
我们还能自定义图片的大小，可以添加width宽度属性，或者高度hight属性，当然两者应该选一个添加就可以了，那样的话，图片会自动等比例缩放或扩大，不会改变宽高比例
还能加border属性，添加图片的边框
这是我添加了10像素的边框的样子
不过这里不推荐使用border来添加边框，我们可以通过CSS代码来控制边框的大小和颜色
<!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>
<!-- alt：替换文本，当图片不显示的时候显示的文字 -->
<!-- width 和 height 属性只需要给出一个值，另一个等比缩放 -- 好处是图片不变形 -->
<img src="cat.gif" alt="这是一条猫" title="这是title文字，鼠标悬停的时候显示" width="500">
</body>
</html>
6、路径
分为相对路径和绝对路径，（在本机上）
还有个网络路径（素材，照片视频等来自网络）
【版权声明】本文为华为云社区用户原创内容，转载时必须标注文章的来源（华为云社区）、文章链接、文章作者等基本信息， 否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容，欢迎发送邮件进行举报，并提供相关证据，一经查实，本社区将立刻删除涉嫌侵权内容，举报邮箱：
cloudbbs@huaweicloud.com
- 点赞
- 收藏
- 关注作者
评论（0）