5、HTML基础之图像与框架

一、插入图像

• 图像标签

<img src="url" alt="" />

• src ：图像文件的 URL

<img
src="https://labfile.oss.aliyuncs.com/courses/1236/coder.jpg"
  alt="程序员"
  title="你好啊"
  width="700px"
  height="600px"
/>

• 相对路径

    图像文件和 HTML 文件位于同一文件夹：只需输入图像文件的名称即可，比如：img src="syl.png" /。
    图像文件位于 HTML 文件的下一级文件夹：输入文件夹名和文件名，之间用/隔开，比如：img src="img/img1/syl.png" /。
    图像文件位于 HTML 文件的上一级文件夹：在文件名之前加入../ ，如果是上两级，则需要使用 ../ ../，以此类推，比如：img src="../syl.png" /。
  

• 绝对路径

    指当所有网页引用同一个文件时，所使用的路径都是一样的。比如D:\webStudy\img\syl.png或者 https://labfile.oss.aliyuncs.com/courses/1236/syl.png。
  

二、框架

• iframe

<iframe src="URL">
  <!-- URL指向不同的页面 -->
</iframe>

• 可以设置宽和高

<iframe src="https://www.baidu.com/" width="400" height="400"></iframe>

<iframe
  src="https://www.lanqiao.cn/"
  width="400"
  height="400"
  frameborder="0"
></iframe>