摘要：
BFC其实没有那么神秘，BFC只是一个独立的布局环境，理解BFC对我们日常的布局设计上有着重要的帮助，并且BFC和Margin Collapse之间有着重要关联。另外文中还提到了clear float时候所产生'clearance'的计算。希望大家有所收获 阅读全文
摘要：
介绍Emmet (前身为 Zen Coding) 是一个能大幅度提高前端开发效率的一个工具:基本上，大多数的文本编辑器都会允许你存储和重用一些代码块，我们称之为“片段”。虽然片段能很好地推动你得生产力，但大多数的实现都有这样一个缺点：你必须先定义你得代码片段，并且不能在运行时进行拓展。Emmet把片段这个概念提高到了一个新的层次：你可以设置CSS形式的能够动态被解析的表达式，然后根据你所输入的缩写来得到相应的内容。Emmet是很成熟的并且非常适用于编写HTML/XML 和 CSS 代码的前端开发人员，但也可以用于编程语言。使用示例：在编辑器中输入缩写代码：ul>li*5 ，然后按下拓展键 阅读全文
摘要：
本文由白牙根据Phillip Whisenhunt的《Backbone.js Tips And Patterns》所译，整个译文带有我自己的理解与思想，如果译得不好或不对之处还请同行朋友指点。如需转载此译文，需注明英文出处：http://coding.smashingmagazine.com/2013/08/09/backbone-js-tips-patterns/，以及作者相关信息作者：Phillip Whisenhunt译者：白牙Backbone.js是一个开源JavaScript“MV*”框架，在三年前它的第一次发布的时候就获得了显著的推动。尽管Backbone.js为Javascrip 阅读全文
摘要：
本文由白牙根据Heydon Pickering的《Semantic CSS With Intelligent Selectors》所译，整个译文带有我自己的理解与思想，如果译得不好或不对之处还请同行朋友指点。如需转载此译文，需注明英文出处：http://coding.smashingmagazine.com/2013/08/20/semantic-css-with-intelligent-selectors/，以及作者相关信息——作者：Heydon Pickering——译者：白牙“结构永远服从于功能，这是不变的法则”，建筑工程师“摩天大楼之父”Louis Sullivan如是说。因为工程师不 阅读全文
摘要：
ie6~7下display:inline-block无效解决方案：需要hack触发hasLayout1 //IE6、7中内联元素（如span）触发layout属性后， 它的行为和标准中的 inline-block类似2 //IE6、7中块级元素（如div）触发layout属性，同时设置了 display: inline ，那么它的行为和标准中 inline-block 类似3 {4 *display: inline;5 *zoom:1;6 }IE6及更早浏览器只支持a(具有href属性)元素的:hoverIE6浮动元素与非浮动元素相邻的3px间距bug解决方案：为浮动元素添加一... 阅读全文
摘要：
此文根据Chris Coyier的《A Complete Guide to the Table Element》所译，整个译文带有我自己的理解与思想，如果译得不好或不对之处还请同行朋友指点。一个非常基础的例子下面是一个非常简单的表格数据例子：这是一个跨多轴的数据。想象下，通过你得手指划过某一行来了解某个人的相关信息。或者从上至下来感受某个数据点的模式和变化。表头和表体上面这个基础例子中我们没有做的一件事是没有语义地指出第一行是该表格的头部。我们本应该这么做。整个第一行的部分没有包含数据，它只是每个列的标题。因此，我们可以元素来完成这件事情，它会包裹第一个元素(它会包裹所有的行所需要的头部信息) 阅读全文
摘要：
display:inline-block;在各浏览器下的问题和终极兼容办法一、IE 5.5、6、7 、8（Q）中display:inline-block;失效兼容办法：IE 5.5、6、7 、8（Q）中 block 元素对 inline-block 支持不完整，如果要达到类似的效果，需要先设置为 display:inline，然后使用zoom:1 等触发 hasLayout。 IE 5.5、6、7 、8（Q）中 inline 元素欲达到 inline-block 的效果只需直接设置此属性值或使用 zoom:1 等均可。二、现代浏览器中 inline 和 block 元素 display:inl 阅读全文
摘要：
float是什么？float即为浮动，在html中的作用是使元素脱离正常的文档流并使其移动到其父元素的“最左边”或“最右边”。下面解释下这个定义中的几个名词的概念：文档流：在html中文档流即为元素从上至下排列的顺序。脱离文档流：元素从正常的排列顺序被抽离。最左边/最右边：上述的移动到父元素最左和最右是指元素往左或往右移动直到碰到另一个浮动元素或父元素内容区的边界（不包括padding）。float造成的影响对其父元素的影响对于其父元素来说，元素浮动之后，它脱离正常文档流，所以它也无法撑开其父元素，造成父元素的塌陷，效果如下图所示。 1 //CSS 2 #wrapper { 3 p... 阅读全文
摘要：
一、中括号[]里面的特殊字符是不用转义的，例如[/]、[.]、[*]、[?]、[+]都是可以直接匹配对应的字符\ . *?+。下面是测试结果： 所以，/[\d.]/这个正则表达式实际上是匹配数字字符或者字符"."，作用等同于/[\d\.]/ 二、match()、exec()和test()的区... 阅读全文
摘要：
一、控制元素的可选值selector { -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; }可选的值：auto——默认值，用户可以选中元素中的内容none——用户不能选择元素中的任何内容text——用户可以选择元素中的文本element——文本可选，但仅限元素的边界内(只有IE和FF支持)all——在编辑器内，如果双击/上下文点击发生在子元素上，改值的最高级祖先元素将被选中。-moz-none——firefox私有，元素和子元素的文本将不可选，但是，子元素可以通过te... 阅读全文