HTML基础——网站图片显示页面

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

1、图片标签

<img />

属性：
src:指的是图片显示的路径(位置)
绝对路径：D:\Pictures\Saved Pictures
相对路径：
①同一级：直接写文件名称或者./文件名称
②上一级：../文件名称
③下一级：写上目录名称/文件名称
width:指定图片的宽度，取值可以是像素值，也可以是百分比
height：指定图片的高度，取值可以是像素值，也可以是百分比
alt：当图片无法正常显示的时候给出的提示信息(该属性的显示效果与浏览器以及浏览器版本有关)

2、首先准备两张图片放在img文件夹下，如图：

代码如下：

 <!DOCTYPE html>

 <html>

     <head>

         <meta charset="UTF-8">

         <title>网页图片显示页面</title>

     </head>

     <body>

         <img src="../img/logo2.png" width="260px" height="45px" alt="logo图片"/>

         <img src="../img/header.png" width="300px" height="45px" alt="header图片"/>

     </body>

 </html>

运行效果如下：