web前端标签学习img

最新推荐文章于 2024-04-14 22:13:18 发布

76博ding

最新推荐文章于 2024-04-14 22:13:18 发布

阅读量154

点赞数

分类专栏： web前端文章标签：前端学习 html

本文链接：https://blog.csdn.net/weixin_62281810/article/details/129245951

版权

web前端专栏收录该内容

5 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>my site</title>
</head>
<body>
  <!--各种图片格式特点：JPG：有损压缩，色彩丰富图片；GIF:简单动画，背景透明;PNG:无损压缩，透明，交错，动画-->

  <!--src属性，讲清楚图片来源，路径+文件名-->
  <!--alt属性，图片的替换文本-->

  <!--如果不加p标签，那么默认所有图片和超链接文本都排成一行-->

  <!--绝对路径，以根目录为基准：D:\桌面\website\StudyTag\images\baidu.png-->
  <!--相对路径，以文档所在位置为基准：images/ifeng.png 。-->
  <!--对于相对路径来说，如果html文件与图片在同一文件夹下，那么直接索引，如果图片在某文件夹下，而该文件夹与html文件在同一文件夹下，那么要标注出该文件夹+'/',如images/ifeng.png，如果图片与html都在各自的子文件夹下，要写成例如：<img src="../images/logo.dif" > 的形式-->
  <p><img src="images/ifeng.png" alt=""><a href="http://www.ifeng.com">凤凰</a></p>
  <p><img src="images/sina.png" alt=""><a href="http://www.sina.com.cn">新浪</a></p>
  <p><img src="images/baidu.png" alt=""><a href="http://www.baidu.com">百度</a></p>
  <p><img src="images/souhu.png" alt=""><a href="https://www.sohu.com">搜狐</a></p>
</body>
</html>