尚学堂-图片标签学习

最新推荐文章于 2020-11-23 12:07:19 发布

奔跑的小脑斧

最新推荐文章于 2020-11-23 12:07:19 发布

阅读量100

点赞数

分类专栏： html学习

本文链接：https://blog.csdn.net/abc1234z0/article/details/103074735

版权

html学习专栏收录该内容

6 篇文章 0 订阅

订阅专栏

<html>
 <head>
  <title>图片标签学习</title>
  <meta charset="utf-8"/>
 </head>
 <body>
  <h3>图片标签学习</h3>
  <hr />
  <!--使用本地资源：图片位于本地电脑中-->
  <img src="img/1.jpg" width="200px" height="300px"/>
  <img src="img/2.jpg" height="200px"/>
  <img src="img/3.gif" height="200px" title="这是一个风景图片" alt="这是一个优美的图片"/>
  <hr />
  <!--使用网络资源：scr-->
  <img src="http://www.fpwap.com/news/yxzn/95069.html"/>
 </body>
</html>
<!--
 图片标签：img
            src:图片路径
                                       本地资源路径：一般本地图片资源使用相对路径即可
                                       网络资源路径:图片资源的URL地址                      
                width:设置图片的宽度，如果是单独设置，则在图片保证不失真的情况下自动缩小或者放大
                                                         单位可以是px也可以是百分比
                height:设置图片的高度，如果是单独设置，则在图片保证不失真的情况下自动缩小或者放大
                                                           单位可以是px也可以是百分比
                           title ：图片标题，鼠标放在图片上的时候会显示
                           alt:图片加载失败后的提示语
                                               注意：图片是不会自动换行的（行内元素）
       注意：
                   相对路径：从当前文件出发查找另外一个文件所经过的路径
                   绝对路径:从根盘符出发所查找文件的路径
-->

运行结果：
在这里插入图片描述

奔跑的小脑斧

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
尚学堂-图片标签学习

<html> <head> <title>图片标签学习</title> <meta charset="utf-8"/> </head> <body> <h3>图片标签学习</h3> <hr /> ...
复制链接

扫一扫

专栏目录