2021-7-7HTML5前端基础

一，学习目标
  1.语义标签（了解）
  2.布局标签
  3.超连接a（精通）
  4.相对路径与绝对路径（掌握，小难点）
  5.多媒体（掌握）
  6.列表ul（掌握） ol dl（了解）

二，语义化标签

  1.什么是语义化？（见名知意）
  HTML 看见标签名字，就知道标签里面的内容大概的含义（掌握）
  <h1><h1> <p></p>  H4 （旧版本）

  总结规律：  只要有取名字的地方，你就语义化

   2.H5语义化标签(结构化标签)(了解)
     <nav></nav>
     <seciton></section>
     <header></header>
     <footer></footer>
     <main></main>
     <aside></aside>
     

三，布局标签（了解）
    div + css布局
    布局概念：  用来布局，没有任何特效
    标签： div： 一块块的矩形， 默认的宽度和浏览器一致（）
           span: 宽度默认是内容的宽度（了解）
    1.从整体到局部
    2.每一个区域都应该有自己符合主题的内容（马桶就应该放在卫生间，电饭煲就应该放在厨房）
    3. 最好是整齐布局

四，超链接a标签(掌握)
    a标签： 实现跳转  
    属性：  href="URL"  
            target  跳转到目标地址的方式 ，默认在原来的页面上跳转
                  属性值： _blank 新开一个网页进行跳转
                           _self  自身页面上进行跳转
    跳转分类： 1.跳转外部链接(网站)
               2.跳转内部的文件（常用）
               3.锚点链接（跳转）同一个页面中滚动
               提问： 补全锚点的语法 <a href="#.."></a>

五，相对路径&绝对路径
  绝对路径（了解）：  在任何位置 都能够通过这个地址找到目标的，就叫做绝对路径
  相对路径（掌握）：  相对于源文件（a标签在哪儿？）去寻找目标的方式，就叫相对路径
 
  1.跳出当前文件夹   "../"
  2.进入目标文件夹  "文件夹（目录）名称/"
  3.在同一文件查找 ./目标名称.后缀  目标名称.后缀

六，多媒体img（重点） 音频，视频（了解）
    1.图片标签：
       标签名称：img
       分类： 单标签
       重要属性： src  引入图片资源
                  alt  图片引入失败，显示的提示文字
    2.改变图片的尺寸： 
        width： 改变宽度
        height: 改变高度
        建议（规范）： 不要同时设置宽度和高度，如果同 时设置图片可能会变形,(不变形的情况，按照比列同时设置)
        
七，列表标签
  1.无序列表（掌握）
      1.相同或相似的内容 和样式（样子）部分，用列表来展示
      2.所有的列表标签都是配合使用（组合拳）
      ul（无序列表）>li 无序列表
      3.细节： 1.能不能单独使用： 不能！会被打
              2. li 中可以放任何内容，包括列表
              3. ul自带原点和间距（通过CSS去清除这些默认的样式）
      4.提问：补充写法
  2.有序列表（了解）
      1.组成： ol（有序列表） >li
      2.特点： 1.自带序号
           2.ol自带间隔
           3.所有内容放在li里面
      3.提问：补充写法
  3.定义列表（了解）
      1.组成： dl(定义列表)>dt + dd
      2.特点： 1.要描述的目标内容，放在dt里面
           2.描述的内容放在，dd里面
           3.dd，dl自带间距
      3.提问：补充写法

<dl>

   <dt>计算机</dt>

   <dd>用来计算的仪器 ... ...</dd>

   <dt>显示器</dt>

   <dd>以视觉方式显示信息的装置 ... ...</dd>

</dl>