移动web开发+前端框架bootstrap+Zepto+gitbook相关笔记（一）

1.Bootstrap中的js组件里的标签页使用的是锚点连接的方式切换选项卡及内容的 ◆导航区域：a标签的href='#home' ◆内容区域：div标签的id='home' ◆使用时注意：【 ◇导航区域与内容区域的位置能够互换 ◇两块儿区域是互相独立的，仅仅经过href属性跟id进行关联，因此才能够防止不一样的位置 ◇若是想要增长导航和内容，须要在两个区域都添加代码，由于须要对应，新增长的导航对应新增长的内容。 ◇ ◇ 】 ◆ ◆ 2.浮动元素与非浮动元素进行组合时 ◆浮动元素的标签必定要放在上面，虽然浮动元素会变成行内块儿结构，可是浮动元素有一个特性，就是后面的浮动元素只会跟着前面的浮动元素占在一行，后面的浮动元素并不会跟着前面的非浮动元素占在一行，若是前面的是非浮动元素，不管上面非浮动元素的空间有多么小，所留给浮动元素的位置多么大，浮动元素都会另起一行的来占位置。 ◆若是前面的浮动元素占的空间很小，后面非浮动元素会跟上来，若是不是文字那么会占在浮动元素的下方，若是是文字那么会跟在浮动元素的旁边，由于文字的层级比浮动元素的层级高。 ◆浮动元素在前，非浮动元素在后，若是不想非浮动元素受浮动元素的影响，那么能够给非浮动元素建立一个格式化上下文，如使用overflow:hidden，获取计算浮动元素的具体宽度，而后经过浮动元素的margin属性来远离浮动元素，这样就不会受浮动元素的影响了，通常都会经过这两种方式来实现浮动元素的这一边是固定宽度，非浮动元素的这一边是自适应宽度。 3.工做以后，大部分公司的员工都是按照设计图去写的，并非按照你本身的想法想怎么写就怎么写。 4.Bootstrap的使用： ◆默认的符合要求就直接使用 ◆html标签组成不对劲，使用浏览器审查元素，进行删减，最后再去修改代码 ◆样式不对，找到bootstrap.css中的该组件的全部样式，而后拷贝到新的css文件中，修改拷贝后的样式，替换掉原来的类名为本身定义的类名，最后在本身的页面中修改原bootstrap中的类名为本身定义的类名便可，可是要先引入本身的css样式表。 ◆ ◆ 5.栅格系统的偏移 ◆栅格一行默认只能使用12份 ◆偏移的宽度也是在这12份里面 ◆栅格一行可以放置元素，计算须要考虑的偏移 ◆col-md-offset-4表示按照正常的四份进行偏移，那么这一行就只能防止8份了，由于有4份做为了偏移的部分。 ◆ 6.响应式是依赖媒体查询，不少的样式随着屏幕的变化而变化，都是经过媒体查询来实现的，实际上也能够经过js 的onresize事件加上获取浏览器的可视区域的宽高来动态修改样式。 7.Zepto这个相似jquery的小框架，优势是最小的能够压缩到几kb，而jquery最小也得几十kb，因此Zepto很好，可是随着时代的发展，移动运营商和浏览器厂商都进化了，网速快了，浏览器也知道去缓存资源了，因而Zepto再也不那么流行了，jquery之因此大是由于功能愈来愈强大了，往里面加的代码也多了，因此大，而Zepto是将jquery最经常使用的方法提取出来再进行封装，因此减小了不少的代码。 8.Zepto介绍 ◆模块儿化，想要使用对应的功能，须要导入对应的模块儿，先要引入核心模块儿，而后须要其它模块儿再引其它模块儿，好比须要使用普通的事件，就引入event模块儿，若是须要使用动画就使用fx模块，再若是须要使用移动端触摸屏幕的事件，那么就引入touch模块儿。 ◆语法跟jq基本同样 ◆如今没有之前流行 ◆如今流行jq，本身封装一个jq，把移动事件封装进去。 ◆它处理兼容性问题的地方所有被砍掉了，否则也不会相比于jquery而言那么小了。 ◆它是专门为移动端而生的，在移动端使用最好。 9.gitbook导出笔记 ◆首先要安装gitbookeditor ◆而后再安装node.js（是一个程序） ◆以后经过npm安装gitbook，安装完毕（C:\Users\LENOVO\AppData\Roaming\npm） ◆其实gitbook中的东西都在（C:\Users\LENOVO\GitBook\Library\Import）里面 ◆使用windows键+r，输入cmd ◆而后使用cd命令切换到gitbook指定的书本目录，输入gitbook build --gitbook=2.5.0，最后就会有一个_book的文件夹，这个文件夹中的html文件就是你写的书本。 ◆ ◆ 10.border有四条边，在不一样状况下，边框是不一样的形状 ◆当只设置两条不相连的两条边时，边框是矩形的。 ◆当设置了相连的边时，边框是梯形的。 ◆若是内容的高度或者padding的值都为0时，这个时候设置的每一条边框都是三角形的。