情景1
1.浏览器兼容 IE8+，webkit, firefox，opera
2.栅格系统 bootstrap，用于快速布局
3.准备一份自己积累的css文件，如base.css其中内容是之前工作积累的常用css如
- 定位
- 文本溢出
- 外边距，内边距
- z-index
- 基础文字颜色规范
- 文字大小规范
- 内容溢出处理
- 光标样式
- 文本换行处理
4.准备一份自己积累的js文件，如Utils.js其中内容是之前工作积累的常用的js方法如
- 获取cookie，设置cookie，清除cookie
- 获取sessionStorage,设置sessionStorage，清除sessioStorage
- 获取localStorage，设置localStorage，清除localStorage
- 验证码倒计时
- 天-时-分-秒 倒计时
- 获取url中的参数
- 多级联动
- 通用对话框
- 图标状态切换时一律加active样式类
- 简易搜索
- 简易日历
5.便捷的插件
- clamp.js用于统一处理各种浏览器的文字溢出样式
- jquery.mCustomScrollbar.min.js用于统一处理各种浏览器的滚动条样式，注意，动态生成的dom渲染会有问题
6.应该注意的细节点
textarea标签中的placeholder问题， textarea的开头标签和结尾标签中间不要有空格，否则，placeholder的效果不会出现
eg:
<textarea placeholder="请填写内容~"></textarea> // 提示内容可以显示
<textarea placeholder="请填写内容~"> </textarea> // 提示内容不能显示
标题点击范围问题，因为h1~h6等的标题标签是块级元素，很多地方是需要点击的，此时，要把他们的display类型转为display:inline-block;因为点击区域只限余有文字的部分，而不是整个标题标签部分，bug中常出现类似问题
7.通用的交互一定要抽出来写，被抽出来的内容的逻辑应该足够简单，这将对后面的交互修改有极大的帮助
8. 移动端调试
调试工具：chrome://inspect/#devices
具体调试方法： http://blog.csdn.net/byc233518/article/details/52437498