HTML笔记

HTML的全称为超文本标记语言，是一种标记语言。它包括一系列标签．通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字，图形、动画、声音、表格、链接等。

-h 元素

-p 元素   lorem 乱数假文

-span 元素【无语义元素】
  块盒 （独占一行） /  行盒（不会独占一行）    

-pre 元素 【预格式化元素】 保持源代码格式显示
  空白折叠：超过1个的连续空白字符（空格、换行、制表）会被显示为1个空格
  在pre元素中不会出现空白折叠
  pre元素常用来在网页中显示代码
  pre元素本质：一种css属性
  显示代码时，常在外面套<code></code>

-Html Entity（实体字符）
  两种表示：&单词;       &#数字;
  小于符号：&lt;   大于符号: &gt;  空格：&nbsp;    版权符号：&copy; ©   分数：&frac12;(二分之一)  &符号：&amp;
———————————————————————————————————————————
-a元素
##href属性
  超链接
  使用a元素，属性为href=""

  锚链接
  先给链接目的地设置id属性，在a元素中属性href="#id"        id属性为全局属性
  回到页面顶部：a元素中属性href="#"
  跳转到另一页面的某个锚点处：<a href="页面地址#id"></a>

  功能链接 （点击后，出发某功能）
  执行JS代码 <a href="Javascipt:>
  发送邮件 <a href="mailto:邮件地址 
  拨号 <a href="tel:手机号码 

##target属性
  表示跳转窗口位置
  其中的两种target属性
  _self:表示在当前页面中打开新页面（默认值）
  _blank:表示在新窗口中打开

##title属性（全局属性）提示文字

———————————————————————————————————————————
-路径写法
##站内资源和站外资源
站内资源：当前网站的资源
站外资源：当前网站之外的资源

##绝对路径/相对路径
1、绝对路径格式(url地址)：协议名://主机名:端口号/路径
协议名：http、https、file
主机名：域名、ip地址
端口号：如果协议是http协议，默认端口号80；https协议，默认端口号443

2、相对路径
以./开头，./表示当前资源所在的目录
以../开头，表示上一级目录中的资源

———————————————————————————————————————————
-图片
##img元素
src属性（source）
alt属性（提示文字）
<img src="">

##和a元素的联用
<a href="">
    <img src="">
    </a>

##和map元素的联用
在map元素中加name属性
在img元素中加usemap属性
在map中划分区域，用子元素area
坐标：圆（圆心、半径） 矩形（左上、右下） 多边形（顶点依次）

##和figure元素联用
用于把图片、标题、文本包裹起来
子元素figcaption表示指代东西的标题里面放h元素

———————————————————————————————————————————
-多媒体元素

##vedio元素
<vedio src=""></vedio>
播放控件：controls属性，取值只能写controls

某些属性只有两种状态：1、不屑  2、取值为属性名， 这种属性叫做布尔属性
H5中 布尔属性可以不写属性值

autoplay：布尔属性
muted:静音播放（布尔属性）
loop：循环播放（布尔属性）

## audio 和视频完全一致

##兼容性
1、旧版本浏览器不支持这两个元素
2、不同浏览器支持的音视频格式可能不一致   视频通常：mp4、webm

不在vedio标签中写src属性，而用vedio的子元素<source src="111.mp4">
                                        <source src="111.webm">
                                        <p>你的浏览器不支持此视频格式，请点击此处下载最新版浏览器</p> 
_____________________________________________________________________________

-列表元素

##有序列表
ol: ordered list  子元素只能是li
li:list items

ol元素的属性 type="i/1/a/A" 序号种类
            reversed(布尔属性) 倒序显示

##无序列表
ul: unordered list 其他与ol相同

##定义(n)列表
通常用于一些属于的定义
dl： definition list
dt： definition title
dd： definition description
———————————————————————————————————————————
##容器元素 表示代表一块区域，为了盛放其他元素
<div></div> 没有语义
<header></header> 通常表示页头或文章的头部
<footer></footer> 通常表示页脚或文章的尾部
<article></article> 通常表示整篇文章
<section></section> 通常表示文章中的章节
<aside></aside> 通常用来表示附加信息
———————————————————————————————————————————
#元素的包含关系
元素的包含关系由元素的内容类别决定

1、容器元素可以包含各种元素
2、a元素中几乎可以包含任何元素
3、有些元素只能存在特定子元素
4、标题元素和段落元素不能互相嵌套，并且不能包含容器元素