HTML 标签插入图像
内容:
1.图像格式
2.插入图像image标签
3.绝对路径与相对路径
图像格式
JPG
有损压缩的图像格式,色彩丰富图片
去掉一些不太关键的信息,文件压缩
GIF
简单动画,背景透明
PNG
无损压缩,透明,交错,动画
透明:
可以给图片指定一种颜色,使其不被显示而成为透明
交错
在显示图片的过程中可以从概念逐渐变化到全貌,看上去也就是清晰度的大小
路径:
绝对路径:
以根目录为基准查找
相对路径:
以该文档所在位置为基准查找
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>image插入图像</title>
</head>
<body>
<h1>Website常用站点</h1>
<h2>目录</h2>
<p>百度一下</p>
<p>谷歌官网</p>
<p>腾讯官网 </p>
<p>微信官网</p>
<hr />
<p><img src="images/Baidu.png" width="300px" height="200px" alt="403"><a href="https://www.baidu.com/">百度一下</a></p>
<img src="images/Google.png" width="300px" height="200px" alt="403"><a href="https://www.google.cn/">谷歌官网</a></p>
<p><img src="images/Tencent.png" width="300px" height="200px" alt="403"><a href="https://www.qq.com/">腾讯官网 </a></p>
<img src="images/Weixin.png" width="300px" height="200px" alt="403"><a href="https://weixin.qq.com/">微信官网</a></p>
<hr/>
<h6>made by One of three_tigers</h6>
</body>
</html>
网页效果: