一，做后台管理的。
1. 插件1: easyUI，中方下载网址：示例都在demo中。
它默认会增加一些代码，不仅需要修改CSS，还需要修改JS。修改起来有点费劲。
2. 把下载的jquery-easyui-1.5.3 放到文件夹下。copy网页中的源码，修改路径，进行测试。
测试效果：
3. 插件2，jQueryUI。功能同上，但是不如上面的好看，只推荐1个星。
二，全栈开发插件
1. bootstrap
需要学习BootStrap的规则
一，响应式。
1. 默认情况下，c2样式把c1覆盖了。通过设置达到：当屏幕宽度小于或者大于多少的时候，让某个值生效。CSS做出不同的响应。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.c1{
background-color:red;
height:50px;
}
.c2{
background-color:grey;
}
</style>
</head>
<body>
<div class="c1 c2"></div>
</body>
</html>
2. @media 当屏幕宽度大于500px的时候c2生效。
当屏幕宽度小于500px的时候c1生效。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.c1{
background-color:red;
height:50px;
}
@media(min-500px){
.c2{
background-color:grey;
}
}
</style>
</head>
<body>
<div class="c1 c2"></div>
</body>
</html>
3. 图标不再以图片的格式显示了。而是以字体的格式显示了。每个图标有了一个编号：font-face
.glyphicon-cloud:before{
content:''2601''}
4. BootStrap的JS是基于jQuery，所以需要把jQuery也导入进来。
如果自己想添加样式,并且想让自己的样式生效的话，一定要给自己的样式设置上优先级。
因为你不知道别人的代码在哪里，如果知道的话，写在别人的代码的下面也是可以生效的。
（由于下载BootStrap没有成功，此处自己没有亲测。待续）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="bootstrap-3.3.0-dist/dist/css/bootstrap.css"/>
<link rel="stylesheet" href="bootstrap-3.3.0-dist/dist/css/bootstrap-theme.css"/>
</head>
<body>
此处插入模板即可，可以用检查的功能获得源码。
<script src="jquery-1.12.4.js"></script>
<script src="bootstrap-3.3.0-dist/dist/js/bootstrap.js"></script>
</body>
</html>
三，bxslider插件
1.下载
2. $(document).ready(function(){ $('.bxslider').bxSlider(); }); 表示当页面加载完成之后，自动执行。
轮播图实例：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="jquery.bxslider/jquery.bxslider.css"/>
</head>
<body>
<ul class="bxslider">
<li><img src="1.png" /></li>
<li><img src="2.png" /></li>
</ul>
<script src="jquery-1.12.4.js"></script>
<script src="jquery.bxslider/jquery.bxslider.js"></script>
<script>
$(document).ready(function(){
$('.bxslider').bxSlider();
});
</script>
</body>
</html>
效果：
3.