bootstrap3 – 白墨代码网

bs是基于html5和css3的, h5和css3是今后的趋势.
html5只是说文档的 “标准”是h5, 但是文档的类型仍然是 html. 所以在写文档类型的时候, 就不能要那个5了 , 即: <!doctype html> 不要写成: <!doctype html5 同样的, 在用zen coding缩写的时候, 也是 html:5, 而不是html5, 前者还有很多类似的文档写法如:html:xt等.

到底是用html5还是xhtml?

当然是用html5!
因为html5是向下, 向后兼容的, 它不会break任何已有的网页, html5完全能够解析之前的xhtml文档的, 你可以把之前的xhtl文档, 改写为html5的标准类型, 不会出什么问题的.
只是说, html5新增了一些类型, 如绘画canvas,媒介回放video, audio, header, footer, nav, 新增一些表单控件如date, time,你直接就可以选择时间日期了, 不用再去使用插件了. 等等,还有支持web绘图的canvas和webgl组件,属性等,就是把以前需要插件的东西, 现在都用内置的标签技术来实现了, 如flash等…. 这些属性在低级的浏览器中可能不被支持, 但是你可以不用这些较高级的标签和属性就好了.
还有, 就是要看你的项目和使用对象, 如果是ie678的用户是主要浏览器, 那就还是使用xhtml, 或者使用h5, 然后针对ie做一些hack…如果是使用firefox, chrome的, 如国外的web站点基本上使用的是html5.

制定标准的组织, what working group & W3C 在html向xml过渡的标准xhtml1.0, 2.0标准, 其实很多厂商并没有遵守.

bootstrap的row必须放在container中, 这样便于为其设置对齐和分配padding.

container的左右padding是15px, 而row的左右margin是 -15px, 这样container和row就刚好抵消, 使得col就能够从container的最左边开始. 而col也有15px的左右padding. 这样”劳心费力” 的设计, 就是为了让 col在嵌套row的时候, 就如同.container一样也成为了一个容器.
其实container也不是固定宽度的, 会根据不同屏幕分辨率而改变尺寸, 从1170, 970, 750px变化.

pin是钉子钉住, spin的结果效果,就是异步加载动画时, 的那个旋转的动画. 因此, spin的意思是: “旋转, 纺纱, 吐丝” 是不是专门有一个插件spin.js就是加载动画的意思,(它是通过js脚本来生成spin的动画, 而不是用一个gif图片来显示???)

spin.js的用法?

spin.js主要是用在异步ajax加载. 它不是像以前那样的使用gif图片, 而是使用js来生成. 而且可以通过opts来设置生成的旋转spin”图片”的参数. 参考网址: spin.js.org
也可以manual insertion:
var spinner = new Spinner().spin()
target.appendChild(spinner.el) // 使用 spinner的el属性.

使用spin.js来生成加载”图片”的优点是, 可以非常方便的调节opts的参数大小, 来生成各种不同的, 符合你想要的”加载”图片.
spin.js生成”图片”的性质: 注意所看到的其实是一个 “图像” 但其实不是一个图片!

在计算机中图形, 图像, 图片的区别?
图片就真的是一个文件, 通常是像素文件,如照相机手机照相得到的图片文件.
图形, 是指由物体的外在轮廓组成的矢量线条. 主要是指由计算机绘图形成的直线, 圆, 矩形, 梯形等
图像,就是我们所看到的影像, 不同于文字的, 具有一定外形轮廓和颜色的影像.
所以, 由spin.js生成的是图像, 是影像.. 不是图片

因为: spin.js生成的其实一个大的div, 类是”spinner”,角色是role=”progressbar” 这个类下面再是n个子div, 这些子div实际上就是外面选择的那些图形, 这些图形的外观是通过css来实现的, css的样式值就是opts中设置的参数值.

注意, 默认的spin是定位在屏幕的中心的, 不会放在父容器div内, 因为 spin的样式值 positon: absolute是绝对定位, 所以, 要想让spin放在父div中, 应将父div的样式position设置为: relative. 就好了.

超链接中的href和onclick的区别?

href和onclick哪个先执行? 是让onclick先执行, 并且a链接是根据 onclick执行的返回结果来判断是否跳转的, 如果onclick 返回true, 则跳转, 如果返回false, 则不跳转. 所以, href是要在那里一直等待的, 等待onclick的返回值的. 所以 onclick 最好是要明确的返回值, 使用return关键词的
href中最好还是写跳转路径, 虽然它是可以写 javascript协议的, 但是不推荐那样写.
如果 onclick没有写return关键字, 那么默认的就是true, 跳转就会发生, 而且不管你在onclick中做了什么选择. 因为onclick通常就是用 confirm(“”), 来判读啊是否要跳转的. 所以不要忘了写return 关键字.

bootstrap的折叠组件/手风琴组件和控制台组件的区别

折叠 **组件 **是由一个触发按钮 + 一个内容div 构成的; 通常布局方式是上下方式的.
手风琴则是由多个折叠组件构成的 功能单元;
折叠组件和控制台组件是不同的, 因为折叠组件的内容div就是在它的下方, 而控制台的内容则是分离的, 通常是左右结构布局的.

关于 transition 样式的使用

transition.js插件, 是bs用来产生过渡效果的插件.
transition: 的英文意思就是过渡…

在 css3中,本身就有, 自带就有transition的样式, 它有四个属性值:
transition-property: 是指元素的什么属性值, 如是让width, 还是让height等什么属性值产生过渡
transition-during: 过渡效果的持续时间
transition-timing-funciton: 过渡效果的时间函数, 就是过渡的方式, 通常是ease; 注意timing和function是两个单词, 所以中间用短横线-链接哦
transition-delay: 延迟,多少时间开始过渡…

比如: div {color: red; transition: width 2s; -moz-transition: width 2s; -webkit-transition: width 2s;
其中, 2s是指持续时间是2s, 这个s不能省略.
-moz, -webkit是前缀, 是针对低版本的 firefox和 chrome的 hack…

css3的transition样式使用的方法:　将ｔｒａｎｓｉｔｉｏｎ：写在某个元素上即可, 如同, border, background等样式一样!! 是由几个分量值组成的.
与其他所有 “静态” 样式不同的是, 由于transition样式本身就是一个 “动态”样式, 估计其内部实现, 本身就 “带有js 的功能, 以前是由 transition.js实现的, 要变化的”, 所以他的执行方式是:　要想生效时, 将鼠标移到元素上 , 如果将鼠标移出元素, 则会恢复到原来的状态. 不像静态样式一开始就会显示出来!!
但是, 要产生transition效果, 最重要的还是 要设置变化开始和结束时的两个确定的属性值: 因为要变化嘛, 就必须有一个开始和结束时的值, 即开始时, 要设置div的初始确定尺寸, 然后要设置 div:hover 这个伪类(必须是:hover伪类, 没有:click的伪类) 的尺寸. 这个是最重要的, 如果不设置 :hover伪类是不会有transition效果的!

如果表示某个地方, 没有什么东西的时候, 使用 there is not…
但是如果要表示没有什么东西做什么, 干什么的时候, 使用 No something do????

bs 生成组件的方法有两种, 一种是标记法, 即完全使用css样式实现, 另一种就是使用js方法, 通过脚本来实现.

bs包括整个js整个计算机程序设计中的方法和事件的区别?

方法是：直接提供给用户使用的api函数, 特点是, 你需要显式的去调用它, 是由使用者规定的, 是主动的 是确定的, 主动的.

事件: 则是不确定的, 你不知道她什么时候发生, 就像一个按钮一样, 它是给用户点击的, 但是你不知道用户什么时候, 会去点击它. 所以, 事件就提供了一种 “伺服, 等待, 监视, 监控, 监听也就是 listener的作用”, 一旦发生某个事件, 就怎么样, 后面的行为和反应是一种 “回调”函数, 是一种所谓的”预案”, 一种预备性反应.

bs中的组件, 特点是, 至少要先使某个元素对象, 如div等, 先成为某个组件后, 然后才能调用 js脚本方法等.

流程图插件 ystep.js ichat.js的使用 bs中的树形图和控制台组件?

参考地址: https://github.com/iyangyuan

湖北省, 千湖之省, 长江中游, 由长江和汉水交汇冲击而成的江汉平原, 和洞庭湖平原. 武汉在很早的时候,由武昌, 汉口, 汉阳三个镇组成的, 包括长江以北的汉口火车站和江南的武昌火车站… 杨园: 音译”洋园” ,以前洋人住的园子.

evan [ev2n]: 人名, 伊凡. evan you vue.js

**注意, 在ystep插件中的 images/pointes_blue.png, 和 images/pointes_green.png 图片, 中的pointes 没有用错, 它不是点 point的复数, 因为点的复数是 points, 这里是: “芭蕾舞鞋底硬脚尖, 绷着脚尖点地, 有尖头的意思” 是pointe 的复数形式. **

**通常, 要查看背景图片, 在 css文件中, 用background 去搜索: background-image: url(‘…’), background-position: **

**如果有多个插件都要用到 images/ 目录, 则可能需要将css和背景图片的位置适当修改一下 **

所谓的min.css 和 min.js等等, 都是将原来未压缩的文件中的空格, 回车, 换行等删去了而已, 全部显示在一行上了. 你可以看压缩后的文件, 显示的只有一行, 而列就有很多列了, 达到几千上万列…

如何区分js对象和json对象?

严格的说, json只是一种数据格式, 不是什么对象. 参考: http://blog.csdn.net/goskalrie/article/details/52151175 , 严格的说，JavaScript中只有一个JSON对象——全局JSON 对象, 如同 Object,Array,Function等一样，其除了所有对象共有的方法外只有stringify()和parse()两个方法。除此之外，js代码中的任何对象都不可能是JSON对象，即便是使用stringify()方法序列化得到的对象也不是，因为 JSON只是一种格式，没有对象一说，平时说的JSON对象，是JSON格式的js对象或是符合JSON数据结构要求的js对象, 所以 “json对象的说法”, 实际上是一种 “误称”, 只是你自己知道就好了。

    var jsObject={  
            name:"Nicholas",  
            age:29  
    }  
    var jsonObject={  
            "name":"Nicholas",  
            "age":29  
    }

对于第二个对象, 其实还是js对象, 或者说是叫 json格式的js对象. 第二种叫做 “js字面量对象”
第二个对象你可以说是js对象, 也可以说是 json格式的js对象. (误称 json对象). 到底是什么, 看你怎么使用, 如果用eval(jsonObject), 则表示js对象, 因为eval要调用js解释器. 如果用parse方法, 则是JSON格式…

总之, 一句话, 就是如果是js对象, 它的属性名称可以加双引号(字面量对象), 也可以不加双引号. 通常, 只要属性名不是js的保留关键字, 都不必加引号. 而如果你要把它当作交换数据的json来使用, 则还是要严格遵守属性名加双引号的.

## js引擎解释器 “总是” 把字面量(没有引号的)当作变量来解析的, 不会自动转换成字符串来解析的!!! 不像php的echo, 对于字面量, 先做变量解析, 如果找不到,就做字符串解析.对待.

因此, 可以很肯定地得出一个结论: 对于js中的ajax等, 众多的js插件中的配置变量, 选项变量,如opts, config等中的属性值, 基本上都不会传变量进去的, 所以, 基本上就只有三种数据类型: 数字, boolean, 其他的基本上都是字符串, 都要加双引号, 如, size: ‘small’, color: ‘green’,…..

在jquery的插件中, 对于列表项, 如果有明确含义的, 就使用明确含义的列表项单词, 如ystep.js中的步骤列表: 就用 steps: [{…}, {….}….] 来表示, 如果没有明确的含义, 如ichat.js中的列表对象, 就用items 来表示, items: [{…}, {…}, …].

在ichat插件中, 每个列表对象, 包括: “type, title, trigger, open, items(子项目) “5个部分组成. ichat是作用在 body 对象上的, 即 $("body").ichat(opts_obj); opts 共有6 个属性: placement, top, title, color(不是文字的颜色, 而是ichat矩形控件的颜色, 实际上就是底色), trigger, items.
ichat中的 trigger的类型, 为 : click, hover, none. 如果为click表示单击将打开和关闭, 这个可以通过jquery的show/hide/slideup/slidedown来实现, 如果为none, 则不管你单击与否都没有关系的.

其实ichat.js这个插件写得并不太好! 至少, 它没有考虑, 鼠标连续多次单击或连续多次地移入移出的情况, 会引起事件队列的堆积, 使动画一直执行, 实际上, 应该在事件响应的回调函数的作用对象执行动画之前先调用 stop(true, true) 方法后, 再调用其他动画就好了. 可以修改这个ichat.js, 在hover事件的回调函数中的适当位置, 加上stop(true, true)就没有那种闪烁现象了.

科学计数法中的E?

任何一个数x 可以写成: a10^n, 其中, 1< |a| <10, 这时就可以把x 记作: aEn的形式, 如 2.1e3, -1.4e6, -3.6e-2...
这里的e(E)仅仅只是表示科学计数法的意思, 不同于数学常数的e=2.7…, 也不同于指数exponent , 指数函数exp()的意思,
它仅仅表示 10的n次方, 这个 e 就已经表示了 10 的n次方了, 所以, 你不要再写10了 , 如: 30000, 直接就写成 3e4就好了. 不要再写成310e4, 那这样岂不是更复杂, 更麻烦了吗, 这个跟科学计数法的本意就相反 . 使用科学计数法就是想使计数的写法更简洁! 所以用一个字母E, 就表示10的多少次方了. 格式就是aEn

bototstrap的栅格系统中, 列的嵌套计算方法是: 是将被嵌套的那一列再细分成12等份, 注意不再是将整个container的宽度分成12等份. 然后被嵌套的列的总数加起来要等于12的时候, 才能充满被嵌套的列, 而不是说嵌套列的总数加起来等于被嵌套列的份数就可以充满了. 这是因为嵌套列和其父列的等份是不同的! 始终记住, 嵌套列的时候, 是以被嵌套的列为对象, 再来分成12等份的!

块级元素中文本的对齐是class=text-left/center/right, 块的对齐是class=pull-left/pull-right/block-center

bs 的列表ul, 包括几个类: ul class=”list-unstyled”, class=”list-inline”(使li成水平方向),
特别有用的是, 对于自定义列表, dl > dt +dd. 使用 dl class=dl-horizontal 可以使自定义列表的dt标题和里面的描述排列在同一行上, 就比竖直排列要美观些. 而且dl由于比ul多了一个dt, 所以描述的内容和语义就更丰富.