li或div高度不同产生错位的解决办法
效果如下：
红色圆圈的部分就是由于第一个li太高了，导致第三个li没有排列到第一个li的下面，错位了。
那个该如何解决这个问题呢？就是不要使用 float:left 的方法，而直接用 display:inline-block 属性。这个属性是在CSS2.1增加的，目前大部分浏览器都支持它。表示“行内块元素”。
部分代码稍微修改一下：
.test li{ padding:5px; min-height:20px; max-height:40px; min-width:40px; max-width:200px; margin:5px; border:1px solid #999; background:#CCC; font-size:12px; margin:5px; vertical-align:top; overflow:hidden;/* float:left; */ display:inline-block;}
见红色部分
再看效果：
看看这样子是不是就正常了呢？
如果高度是固定的，是不会有这个问题产生的，所以如果高度能够确定，还是可以继续使用float:left的方法。
函数：JavaScript函数通过function关键字进行定义
CSS：是一门语言，用于控制网页表现，让页面更好看的。 CSS（Cascading Style Sheet）：层叠样式表
CSS与html结合的三种方式：
1、内部样式：用style标签，在标签内部定义CSS样式。
Title
Hello CSS~
2、内联样式：在标签内部使用style属性，属性值是css属性键值对
Title
Hello CSS~
这种方式html代码就和css代码耦合在一起了，但不利于以后的复用，不推荐这么写
3、外部样式：定义link标签，引入外部的css文件
Title
hello css~
下面这是文件中的内容
p{
color: green;
}这是引用的外部的demo.css的文件。
选择器：选择器是选取需设置样式的元素（标签）
1、元素选择器：元素名称{键值对}
Title
div1
div2
2、id选择器：#id属性值{键值对}
Title
div1
div2
div4
3、类选择器：.class属性值{键值对}
Title
div1
div2
div4
div5
JavaScript：是一门跨平台、面向对象的脚本语言，来控制网页行为的，它能使网页可交互
就像这种，在不跳转页面的情况下，可以更换更换图片的。
脚本语言：就是浏览器可以直接解释执行，不用经过编译。
JavaScript和Java是完全不同的语言，不论是概念还是设计。但是基础语言类似。
JavaScript引入方式：
1、内部脚本：将JS代码定义在html页面中。在html中，JavaScript代码必须位于script标签中。
提示：在html文档中，可以在任何地方，放置任意数量的script标签。但是一般会把脚本置于body标签元素的底部，可改善显示速度，因为脚本执行会拖延显示。
Title
2、外部脚本：将JS代码定义在外部JS文件中，然后引入到html页面中。
注意：外部脚本中不能包含script标签；script标签不能自闭合，标签必须写全。
Title
demo.js文件中的代码为
alert("hello js")书法语法：
1、区分大小写：与Java一样，变量名、函数以及其他一切东西都是区分大小写的。
2、每行结尾的分号都是可有可无的
3、注释：单行注释： //注释内容。 多行注释： /*注释内容*/
4、大括号代表代码块
输出语句：
window.alert()写入警告框 document.write()写入html页面 console.log()写入浏览器控制台
变量：
JavaScript中使用var关键字（variable的缩写）来声明变量。
JavaScript是一门弱类型的语言，变量可以存放不同类型的值。
变量名需要遵循以下规则：
1、组成字符可以是任何字母、数字、下划线或美元符号。
2、数字不能开头
3、建议使用驼峰命名
ECMAScript6新增了let关键字和const关键字。
let关键字来定义变量，用法与var类似，但是声明的变量，只能在let关键字所在的代码块内有效，且不允许重复声明变量名相同的变量。
const变量用来声明一个只读变量。一旦声明就无法更改。
var定义的变量的特点：
1、作用域为全局变量，即使var变量写在某个代码块中，在代码块外部也能访问。
2、变量可以重复定义，可以定义俩个变量名相同的变量，后定义的覆盖前面的
数据类型：
JavaScript中分为原始数据和引用数据
5种原始数据：
number：数字（整数，小数，NaN（Not a Number））
string：字符，字符串，单双号都可以。 boolean：布尔。true或false。 null：对象为空
undefined：当声明的变量未初始化时，该变量的默认值为undefined。
使用typeof运算符可以获取数据类型 alert（typeof age）
运算符
运算符几乎和Java的一致，不同的就是JavaScript中多了=== 全等于
Title
==:先判断类型是否一样，如果不一样，则进行类型转换，然后再去比较其值
===：判断类型是否一致，不一致直接返回false。一致时才会去比较值
数据转换：
其他类型转换为number：
1、string：按照字符串的字母值，转换为数字，如果字面值不是数字，例如var str=‘abc’，则转换为NaN。一般使用parseInt方法转换。
2、boolean：true转换为1，false转换为0.
其他类型转换为boolean：
1、number：0和NaN转为false，其他数字转为true。
2、string：空字符串转为false，其他字符串转为true。
3、null：fasle
4、undefined：false
函数：JavaScript函数通过function关键字进行定义
Title
注意：形式参数不需要写出类型，返回值也不需要定义类型，可以在函数内部直接使用return返回即可。因为JavaScript是弱类型的语言。函数中即使定义函数时写了2个形参，调用函数时可以传入2个以上的参数。
JavaScript
定义：
Title
特点：JavaScript数组相当于Java中的集合。变长变类型。
Title
且同一个数组中不必须全是number类型，可以有不同类型。
数组方法： push方法，添加元素。 splice方法，删除元素
Title
字符串对象：
定义：
Title
length属性：字符串的长度。
charAt（）返回指定位置的字符。 indexOf（）检索字符串。 trim（）去除字符串前后俩段的空白字符。
自定义对象：相当于Java中类的定义
Title
BOM：Browser Object Model浏览器对象模型
JavaScript将浏览器的各个组成部分封装成对象。
组成：Window：浏览器窗口对象。 Navigator：浏览器对象。 Screen：屏幕对象
History：历史记录对象。 LOcation：地址栏对象。
window：弹框方法：alert（）弹出警告框和comfirm（）弹出有确认和取消按钮的对话框。点确认返回true，取消返回fasle
定时器方法：serlnterval（）按照周期（毫秒）来调用函数或计算表达式，循环执行。
setTimeout（）在指定的毫秒数后调用函数或计算表达式，这个只执行一次。
Title
history：历史记录
方法：back（） 加载history列表中的前一个URL。 forward（）加载history列表中的下一个URL。
location：地址栏对象
属性：href：设置或返回完整的URL
Title
DOM：Document Object Model 文档对象模型
将标记语言的各个组成部分封装成对象：
Document：整个文档对象。 Element：元素对象 Attribute：属性对象
Text：文本对象 Comment：注释对象
获取Element：元素对象
Title
黑马
程序员
电影
旅游
游戏
Element对象中的俩个常用属性： style：设置元素css样式。 innerHTML：设置元素内容。
checkbox对象中一个重用属性ckecked：设置或返回元素是否被选中。让对象的checked属性为true即位被选中，为fasle就是未被选中。
事件监听：
事件：html事件时发生在html元素上的事情。
事件监听：JavaScript可以在事件被侦测到时执行的代码。
事件绑定的俩种方式：
一：
Title
二：
Title
常见事件：
onclick：鼠标点击事件。 onblur：元素失去焦点。 onfocus：元素获取焦点
onload：某个页面或图像被完成加载。 onsubmit：当表单被提交时触发该事件。
onkeydown：某个键盘被按下 onmouseover。鼠标被移到某个元素上
onmouseout：鼠标从某个元素移开
正则表达式：定义了字符串组成的规则
定义：俩种方式
var reg=/^\w{6,12}$/
var reg2=new RegExp("\\w{6,12}$")方法：test（）方法
Title
判断字符串str是否符合正则表达式reg。
语法规则：
^：表示开始。 $：表示结束。
[]:表示某个范围内的单个字符。
.:代表任意单个字符，除了换行符和行结束符。
\w：代表单词字符：字母，数字，下划线
\d:代表数字字符
量词语法：
+：至少一个
*：零个或多个
？：零个或一个
{x}：x个
{m,}：至少m个
{m,n}：至少m个，之多n个
