HTML入门（1）

html5骨架

• DTD
  不同版本的DTD是不一样的，只需要记住html5的即可
  html5：
• html标签对
  图中没有注明
  lang = "en" lang表示网页的语言，en表示英文，zh表示中文
  在标签对中的标签对，用tab进行缩进
• head标签对
  网页的配置
• body标签对
  网页的内容

字符集

它是一个单标签

• meat
  表示网页的基础配置
• charset
  字符集
• "UTF-8"
  是字符集的一种

utf-8和gb2312

• 只用中文和英文的就用gb2312，一个汉字占2个字节
• 用其他语言就用utf-8，一个汉字占3个字节
  注意：字符集类型要和文件类型一致否则会出现乱码

title

用来设置网页的标题

• 也是搜索引擎收录的网页标题，所以要好好设置

SEO

• 标题
  
• 关键字
  
• 描述
  
• 这些东西都会被搜索引擎识别所以要好好设置

认识标签

标签对

• 成对出现的标签就是标签对
• div标签
  像是一个盒子，网页就是由一个一个盒子组成的，百度的网页：
  
• p标签 段落
• h1 一级标题

单标签

• 只有起始标签

空白折叠现象

• 如果文字中有多个空格，网页上只显示一个
• 文字和标签对有空格，会直接被忽略

转义字符

• <
• >
•  
• ©

常见的类名

• 页头 header
• logo logo
• 导航条 nav
• 横幅 banner
• 内容区域content
• 页脚 footer

关于列表

• ul,ol,dl在什么场合使用
  无序列表 有序列表 定义列表
  ul导航条
  ol排行表
  dl文字构成定义关系就可以使用
• ul，li标签使用规则
  ul的子标签只能有li，li里面啥都能放
• ul，ol常见属性有哪些
  ul的属性：type
  
  ol的属性：type（判断是a,1,A），start（从第几个开始的有序列表），reversed（倒序排列）
  
  

多媒体

• 图片
  
• 图片必须复制到图片文件夹内
• 可以设置width属性的时候不用写单位，默认像素为单位，如果只设置一个，默认按比例缩放
• 支持图片格式
  
• 相对路径
  回退层级 ../
  xx文件夹下 xx/
• 绝对路径
  描述文件的精准地址
  
  
  在html中输入如上，就会出现百度的logo
• 超链接
  
• href属性支持相对路径和绝对路径
• 在新网页中打开超链接
  通过target属性设置为 blank
  <a href="1.html target = blank">
• 给图片设置超级链接
  用a标签包裹图片即可
• 下载链接
  
• 邮件链接和电话链接
  

音频和视频

• 音频
  
  常用格式是MP3和ogg
  ioop属性 可以让他循环播放音乐
• 视频
  
  常用格式：mp4 ogv webm等
  ioop属性 可以让他循环播放音乐

区块标签

语义化标签

• span 区块标签
• 
  基本被css取代
• 强调语义
  
  这些都是默认的样式，学习css之后可以有其他的样式
• figure figcaption