写样式时通常需要多个元素使用一个样式 下面的css选择器可以任君挑选
- 通配符选择器 （ * 选择所有元素）
- 标签/元素选择器 （ div 选择标签为div的所有元素）
- id选择器 （#box 选择id为box的元素）
- 类选择器 （选择类名为one的所有元素）
- 后代选择器 (.one div 选择类名为one内部的所有div元素 不论嵌套多少层都可以找到)
- 子选择器 （.one>.one_1 选择.one元素的子元素里类名为one_1的所有元素）
- 群组选择器 （div,p 选择标签为div和p的所有元素）
- 相邻同胞选择器 (.one+.two 选择紧挨着one元素后面的two元素)
- 伪类选择器
:checked input:checked 选择选中的input元素
:active a:active 选择已被点击的链接
:disabled input:disabled 选择被禁用的input元素
:empty div:empty 选择没有任何子元素的p元素
:enabled input:enabled 选择已启用的input元素
:hover a:hover 选择鼠标悬停在上的元素
:nth-child(n) p:nth-child(2) 选择父元素的第二个子元素
等等
以上是常用的选择器
在编写代码过程中我们可能需要按属性来选择元素 这时候使用属性选择器会很方便
[attribute] 选择带有attribute属性的元素
[attribute=value] 选择所有使用attribute=value的元素
[attribute~=value] 选择attribute属性包含value的元素
[attribute|=value]：选择attribute属性以value开头的元素
伪元素选择器 使用双冒号 .two::before .two::after 向.two元素的前面/后面创建一个伪元素
css选择器优先级顺序
id选择器<类选择器<标签选择器<子选择器<后代选择器<伪类选择器
需要注意是!important的优先级最高,但出现冲突时则需比较‘四位数’
优先级相同时，则采用就近原则,选择最后出现的样式
继承来的属性优先级最低
HTML5新增了很多特性 这些是目前我用过的新特性
1. 语义化标签, 例如header,footer,section,article等
语义化标签的作用：提升页面的阅读性
2. 新增媒体元素 audio,video audio和video标签能够很容易输出音频和视频
3. 用于绘画的canvas属性Canvas API 提供了一个通过javascript和html的canvas元素来绘制图形的方式
可以用于动画，游戏画面，数据可视化，图片编辑
4.表单元素
新增的表单元素
<datalist>: 元素规定输入域的选项列表，使用<input>元素的list属性来绑定datalist
<keygen>: 提供一种检验用户的可靠方法，标签规定用于变淡的密钥对生成器字段
<output>: 用于不用类型的输出，比如计算或脚本输出
新增的表单属性
placeholder属性: 提供输入字段预期值的提示信息，该提示会在输入字段为空时显示，并会在输入框获得焦点时消失
required属性：是一个boolean属性，要求填写的输入框域不为空
pattern属性：描述一个正则表达式用于验证<input>元素的值
max/min属性：最大最小值
step属性：为输入域规定合法的数字间隔
autofocus属性：是一个boolean属性，在页面加载时自动获得焦点
height/width属性：用于image类型的<input>标签的图像高度和宽度
multiple属性：是一个boolean属性，规定<input>元素中选择多个值
5.web存储
localStrorage 没有时间限制的数据存储 存在本地
sessionStrorage 有时间限制的数据存储，本次会话结束(关闭浏览器)数据删除
...
刚开始学html的小伙伴可能会分不清块级和行内 下面就介绍一下块级元素和行内元素的区别
1.块级可以包含行内元素和块级元素；行内元素不能包含块级元素
2.块级元素会占据一行，垂直方向排列，行内元素不会占据整行，在一条直线上排列，都是同一行，水平方向排列。
3.行内元素与块级元素属性的不同，主要是盒模型属性上，行内元素设置width无效，height无效(可以设置line-height),margin上下无效，padding上下无效。
js的数据类型
一般分为基本数据类型和引用数据类型
基本数据类型 number string boolean undefined null Symbol（es6新增）
引用数据类型 Object对象 Array数组 Function函数 Date日期 RegExp正则
如何判断基本数据类型
typeof 返回的是一个字符串 该字符串就是判断的变量的类型 返回结果只有以下几种 number,string,boolean,object,undefined,function
对于数字类型来说 typeof(1) 返回值就是number
对于字符类型来说 typeof('123') 返回值就是string
对于布尔类型来说 typeof(true) 返回值就是boolean
对于对象,数组,null类型来说 typeof(null),typeof(window) 返回值是object
对于函数类型来说 typeof(Date),typeof(Function) 返回值就是function
如果判断的值是没有定义的(比如说不存在的变量，函数或者undefined) 那么返回值就是undefined
用代码验证一下
console.log(typeof 1); //number
console.log(typeof "arr"); //string
console.log(typeof ("123" + 1)); //string
console.log(typeof true); //boolean
console.log(typeof window); //object
console.log(typeof null); //object
console.log(typeof [1, 2, 3]); //object
console.log(typeof { a: 1 }); //object
console.log(typeof Date); //function
console.log(typeof Function); //function
console.log(typeof arr); //undefined
console.log(typeof undefined); //undefined
以上代码可以看到，typeof在判断一个object数据时只能知道这个数据是object，不能具体知道是哪一种,想要区分对象，数组，null用typeof是不可行的
instanceof运算符
用于检测构造函数的prototype属性是否出现在某个实例对象的原型链上
一般用来检测复杂数据类型
下面上代码
function a() {}
console.log([] instanceof Array); //true
console.log({} instanceof Object); //true
console.log(a instanceof Function); //true
console.log(1 instanceof Number); //false
console.log("" instanceof String); //false
console.log(true instanceof Boolean); //false
console.log(null instanceof Object); //false
console.log(new Number() instanceof Number); //true
console.log(new String() instanceof String); //true
console.log(new Boolean() instanceof Boolean); //true
可以看到对于基本类型的数据，instanceof是不能直接判断的，因为实例是一个对象或函数创建的，是引用类型，要通过基本类型对应的包装对象来判断，所以null和undefined就检测不了了
