HTML的学习笔记
Html的书写规范：
###1 书写位置，必须写在开始或者单标签内，与标签名之间用空格分开。
2 属性包含属性名，属性值，类似于key-value形式。
3 一个标签内可以设置多个不同的属性，属性之间用空格分开。
4 部分属性标签可以设置多个属性值，但必须在一个双引号之间，中间用空格隔开。
Html的常用的标签：
HTML的标签可以添加属性，属性可以提供更多关于html的信息。
<html>标签：定义html文件的根元素，表示整个html文档，所有的标签都在它的内部。
<head>标签：用于存放<title><meta><base><style><srcipt><link>标签，内部用于对网页的设置，除了<title>标签，其余的都不显示在浏览 器上。<head>中必须设置的标签就是<title>标签。
<title>标签：让网页有一个标题，如果设置为空，那么就会以文件名作为网页的标题。可以作为搜索引擎的关键字，作为SEO的优化。内部 的内容会显示在搜索结果的标题部分，作为浏览器收藏夹默认的标题。
<body>标签：定义网页的主体部分，用来存放显示内容的标签，内部的元素内容会显示在浏览器上。
标题标签：从<h1>到<h6>从大到小六个级别的容器级标签，它们之间不能相互嵌套。
段落标签：给标签内部的内容添加一个完整的语义，不负责换行。
换行标签：<br /> 只进行换行操作。
图像标签：由<img>标签进行定义。在指定的位置上插入一张图片，通过src,width,height,border,title属性对图片进行操作。
音频标签：使用<audio>标签，添加音频之后不会显示播放器控制条，要添加controls属性才会显示。
视频标签：使用<video>标签，添加视频文件之后不会显示播放器控制条，要添加controls属性才会显示。
超级链接：
html使用超级链接与网络上的另一个文件相连。使用<a>标签创建连接。可实现页面内跳转和跨页面跳转。
<a>标签的属性：
href:表示跳转的链接。
traget：分为_self和_blank,_self表示在原窗口跳转。_blan表示打开一个新的窗口进行跳转。
title:用来对选中的超链接进行一个文字说明。
锚点跳转(页面内跳转)：
1设置锚点：设置跳转目标位置。分为两种：1设置唯一的标签ID 2设置唯一的name
2添加链接：以#开头后面加上唯一的id或者name。
跨页面跳转：在链接后面加上锚点跳转的格式。
Html的列表：
无序列表：需要和<li>参与,ul和li是嵌套关系,ul>li
有序列表：需要和<li>参与,ol和li是嵌套关系,ol>li
定义列表：由dl、dt、dd 组成。dl 嵌套dt 和dd dt和dd是同级。
<div>和<span>标签常用作布局工具。
Html的表格：
1 至少由三个标签组成，分别是<table>，<tr>和<td>
2 <th>:表头单元格，用来显示单元格的名称，其名字是居中显示，<td>是靠近首行。
3 rowspan:跨行合并，指上下两行的合并。
4 colspan：跨列合并，指左右两列的合并。
Html的表单：
网页中用来提供给用户输入的空间，用来收集用户输入的信息，通常由表单域，提示信息和表单控件组成。
表单域的标签属性：
<form>标签：标签通过对应属性规定提交数据的方法和位置。
action:指定接收并处理表单数据的服务器的url地址。
method:用于设置表单数据的提交方式。get/post
<input>标签：输入标签，可以根据设置不同的type来显示不同的输入控件。
单选框：input标签的type值radio,单选框一般都是成组出现，多个单选框组成一组的选择。同一组之间必须是互斥的 关系，通过给同一组的单选框设置相同的name属性值来实现。
button：input标签的type值为button，普通的按钮，没有任何的特殊功能。
reset：input标签的type值为reset，重置按钮，将一个<form>中的内容清空，重置为默认值。
submit：input标签的type值为submit，提交按钮，将填写的数据 提交到<form>中指定的服务器，并重置信息。
image：input标签的type值为image ，默认与提交按钮的功能相同，使用的图片需要用src来查找正确的路径。
text：input 标签的type值为text，一个单行的文本输入框。
password：input标签的type值password，也是文本输入框，只是显示的输入内容为加密的。
checkbox：input标签的type值为checkbox，复选框。
注：无论单选框和复选框都可以设置默认勾选项，将selected属性值设置为selected 就可以实现。
<textarea>标签：使用文本域标签定义，可以输入多行文本的区域。与<input>标签的区别是，不需要用value属性值去设置，只需 要在标签中间写就可以了。
rows：是表示文本框的最大的显示行数，如果超过了会被隐藏并出现滚动条。
cols：列数，用来显示一行最多显示多少个字节。
下拉菜单：
<selecet>：表示下拉菜单的整体结构
<option>： 表示下拉菜单的每一项 将selected 属性值设置为selected 就可将这个选项设置为默认选项。如果下拉菜单 选项很复杂，可以使用标签对选项进行分组。
<label>标签：帮表单元素定义标注，如果表单控件与label进行绑定后，可以扩大点击内容。
绑定形式：1 设置id 给绑定的其他内容用<label>进行包裹 给<label>标签中间for属性设置为id值
2 如果绑定内容和表单元素写在一起的时候，可以化简。将其直接包裹在<label>内部
CSS基本语法
作用：静态的修饰网页，配合脚本语言动态的对网页元素进行格式化。
CSS代码根据书写位置不同有四种方式：
内联式：在html标签上的style属性中写CSS样式。所有的属性的CSS样式属性总体 组成标签的style属性的属性值。缺点是：内联 式必须写在标签上，没有完全 脱离，让Html解构繁重，一个内联式的css代码只能给一个标签使用，不适 合重复使用， 增加代码量。
内嵌式：在Html文件中，<head>标签内部有一个<style>标签，<style>标签书写在<title>标 签后面,所有的css代码书写在<style> 标签里面。优点是实现了结构和样式的初步 分离，多个标签可以利用一段代码设置样式，节省代码量。缺点是没有完全 分离结构和样式，多个文件利用同一个格式并没有节省代码量。如果CSS代码太多， 容易造成头重脚轻。
外联式：在一个单独的扩展名为.css的文件中。在.css文件中书写时，不需要再添加<style> 标签。外联式样式表必须引入到html文 件中。在html中的<head>标签中使用<link> 标签进行引入。优点是实现了html和CSS完全分离，多个Html文件可以共用 一个css文件，可以使一个css文件更改，多个Html文件可以同时变化。一个Html文 件可以引入多个css文件，实现一个页 面中代码分层。
导入式：在内嵌式样式表利用@import url(路径)语句进行导入。导入式样式表的作用和外联式几乎相同。缺点是导入式的会在 HTML结构加载完毕之后再进行编译，网速较慢的情况下不会出现CSS样式，用户体验不好。
CSS样式规则:
CSS规则由两个主要的部分构成，选择器以及一条或者多条的声明。
如果Html中不设置字号，那么浏览器会默认设置字号，chrome ie 浏览器默认的是 16。chrome浏览器支持最小的字号是8px,ie浏 览器支持最小的字号是1px.
网页中设置最小字号是12px,如果低于12，则会出现兼容问题。
盒子实体化三个属性：
width定义元素占有的宽度。
height定义元素占有的高度。
bcakground-color定义元素的背景颜色。
CSS选择器：
基础选择器：标签选择器，id选择器，类选择器，通配符选择器
高级选择器：后代选择器，交集选择器，并集选择器。
标签选择器：去通过标签名选择标签元素。选择范围是html文件中所有的同名的标签
优点：可以选中所有的同名标签，设置所有的标签的共同样式。
缺点：只能实现全选，不能够对局部的标签添加特殊的样式。
ID选择器：通过标签上的ID属性去选择标签，书写方式为#id 选择范围只能选中一个 标签。
缺点：id选择器只能实现单选，不能完成多选。
类选择器：通过标签的class属性去选择标签。书写方式为.class属性值。选择范围内文 件内所有的class属性值相同的标签。一 个标签的class属性可以有多个属性 值。
优点：通过一个类选择器进行多选，选中多个样式，添加公共样式。一个标 签可以被多个类选择器选中，提取公共 样式和单独样式，节省代码量。
通配符选择器:通过一个特殊符号选择页面内所有的标签。书写方式为*,选择范围为包含在内的所有的标签。
优点：可以实现全选，简化书写。
缺点：通配符选择效率低，设置部分公共样式不是所有的标签都需要添 加，让浏览器做一些无用工作。
后代选择器：通过标签之间的嵌套关系去选择元素，基本组成部分就是基础选择器。
书写方式为空格表示后代基础选择器中间用空格分隔，前面的标签必须是后面的祖先级。
优点：减少class属性的定义适用，选择效率更高。
交集选择器：通过一个标签纸之上满足所有的基础选择器的需求去选择标签。书写方式 为基础选择器进行连续书写，如果有标 签选择器参与交集，则必须写在开 头。选择范围为满足所有基础选择器需求的标签。如果有一个条件不满足 则无 法被选中IE6不支持类名连续的写法。
并集选择器：不同选择器中的元素都要设置相同的样式，书写方式为将多个选择器中间 用逗号隔开，最后一个不需要加逗号。 用途为，如果有多个标签具有公共 样式，来代替通配符的选择器。
CSS层叠式：
继承性： 如果一个标签没有设置一些样式，但是他的祖先级设置过，那么该标签也会加 载这些样式。能够被继承的样式是所有 的文字相关样式，其余的不可以被继承。
层叠性：多个选择器在进行对比的过程中，最终只会有一个属性会被加载，他会层叠覆盖掉其他的属性。判断最终胜出的属 性是谁，要依赖优先级。
基础选择器的权重：根据选择范围，选择范围越大权重越小，通配符＜标签选择器＜类 名选择器＜ID选择器
高级选择器的权重：依次比较组成高级选择器的ID的个数，类的个数，标签的个数， 如果前面能比较出大小就不再比较后面， 如果前面相等，就继续 往后比较，直到比较出大小。
注：如果选择器权重都相同，那么后写的会层叠先写的
