二、标签、路径、超链接

1.常用标签

meta标签，表示网页中的一些元数据
属性：
		name：要设施的数据的名字
		content：要设置的数据的值
		http-equiv：设置Http协议的响应头
常用功能：

<!--    description 用于告诉搜索引擎网页的主要的内容 -->
    <meta name="description" content="这是一个非常非常好的网站...">
<!--    keywords用来指定网站的关键字，多个关键字使用逗号隔开-->
    <meta name="keywords" content="HTML5,Java,大数据">
    
<!--    这个标签用来设置请求的重定向 （下面这句表示，当你打开这个网页3秒之后，跳转到百度）-->
    <meta http-equiv="refresh" content="3;url=https://www.baidu.com">

2.语义化标签

header：表示网页的头部，头部可以包含logo、导航、搜索框、广告条
main：表示网页的主体，一个网页中只有一个main标签
footer：表示网页的底部，底部可以包含版权声明
nav：表示导航

<nav>
	<a href='#'>Home</a>
	<a href='#'>Home</a>
</nav>

article:表示网页中一块内容（一般是一些文字的信息）
aside：表示侧边栏（辅助信息）
section：表示一个区块
hgroup：表示一个标题组
div：表示一个去开

• 以上的元素都属于块元素，块元素在页面中会独占一行

em：强调（语气）
strong：强调重要性
i：斜体
b：加粗
q：短引用

• 以上这些元素都是航你元素（内联元素），在页面中不会独占一行
  blockquote：长引用

3.外部资源的标签

（1）图片标签

<img src="" alt="">

• 作用：用来向网页中引入一个外部图片

• 属性：

  • src 表示图片的路径
  • alt 表示图片的描述（主要用于搜索引擎识别图片的信息）
  • width 指定图片的宽度
  • height 指定图片的高度

• 相对路径

  • 目前我们使用的路径是相对路径（相对路径只能引入项目内部的资源）

    • 相对路径是相当于当前文件所在的目录计算的

    • ./表示当前目录（可以省略）

    • …/表示上一级目录，返回几级就写几个

      root
      - index.html 1.jpg
      - 1.jpg

      root
      - index.html hello/1.jpg
      - hello
      - 1.jpg

      root
      - index.html hello/abc/1.jpg
      - hello
      - abc
      - 1.jpg

      root
      - 1.jpg
      - hello
      - index.html …/1.jpg

      root
      - 1.jpg
      - hello
      - abc
      - index.html …/…/1.jpg

      root
      - heihei
      - 1.jpg
      - hello

• 内联框架

  • iframe，用来引入一个外部的网页
  • <iframe src="https://www.baidu.com" frameborder="0" width="500" height="500"></iframe>

（2）音视频标签

• 使用audio标签来引入音频文件
• 使用video标签来引入视频文件

注：使用audio标签来引入一个外部的音频

     一般情况下，音频都是使用mp3
      
      默认情况下音频会在页面中显示和播放
      
      controls 用来设置是否允许用户控制音频的播放
          这个属性比较特殊，它没有属性值
          如果允许用户播放，则添加该属性，
              否则不添加，不需要设置属性值
              
    autoplay 用来设置音乐是否自动播放
         一般的浏览器默认情况下，都不会自动播放
         
    该标签不支持IE8及以下浏览器

<audio controls autoplay loop></audio>
    <source src="">
    <source src="">
    <source src="">
    您的浏览器不支持audio标签
</audio>
<video controls autoplay loop></video>
    <source src="">
    <source src="">
    <source src="">
    您的浏览器不支持video标签
</video>

4.超链接

• 超链接用来跳转到一个其他的页面
• 使用 a 标签来设置超链接
• 属性：
  • href 跳转的目标的路径
    • 打开外部的页面
      □ <a href="https://www.baidu.com">link</a>
    • 打开内部的页面
      □ <a href='../hello.html'>link</a>
    • 跳转页面的指定位置（锚点）
      □ <a href='#id属性值'>link</a>
  • target 打开页面的位置
    • _self 默认值 当前窗口打开
    • _blank 在新窗口打开（慎用）