在新年将至的当中，大家都在思考，都在回味，都在总结，都在向往。我也同样不能脱俗，一直都在思考，为2013一年，为自己走过的这一年，为w3cplus这一年做一个总结，但一直不知道如何执笔开始。思来想去，有了下面的一些记录，只想让这些记录告诉我，2013看走过的一切，同时让我更好的迎接2014年，迎接新的一年，迎接新的人生。

自从有了W3cplus之后，我热衷于前端技术，喜欢前端的活动，更爱上了前端的技术分享。在2013年当中，在众多朋友一起努力之下，总共发表博文279篇，其中技术博文216篇，CSS3教程61篇，CSS3案例25篇，收集前端各类在线工具近100个，整理jQuery插件近300个。还有前端较为新的技术，包括Sass教程47篇，Grunt教程近10篇，响应式设计近27篇。而且在今年在众多同学的帮助之下，组织翻译外国博文近115篇。看到这些数字，也让自己感觉到在2013年当中没有白混，让我自己更好的准备迎接2014年。

设计模式通常是一组最佳实践和技术，主要目的是用来解决一些最常见的设计“问题”，通常是在上下文中提出的设计原则。这些原则之是一“停留在页面”的原则。这一原则是建立在页面刷新都打破用户的心中想要的流程基础上，造成所谓的“变盲”，我们需要用户无论保时何地可以避免打破这种视觉流程。我们可以在保留用户在网页和模型的过程中做出明智的选择。一个方式，让用户在同一页面上试图让内容在当前页面的背景下，通过展示一个“迷你页面”，或一个弹出的对话框。这个轻量级的层就是我们所说的一个“浮层”。

公认的拥有一个编写和管理CSS的方法比什么都要更好。尽管如此，一些开发人员的实践是不利于语义化质量和长期的可维护性。我们要讨论一些被提倡的"CSS框架方法”的问题和作为Web开发人员，我们如何可以更好的解决这些问题。今天最流行的CSS开发框架技术当属OOCSS，尽管还有其他类似的技术存在，如BEM。这些方法试图对CSS采用面向对象的编程原则。尽管样式语言和面向对象的软件设计原则在概念之间存在一定的问题，这些微妙的东西对于一个欠缺经验的开发人员来说可能不会立即显现出来。最令人不安的是，这些方法已经可以广泛的看到博客给其冠以"最佳实践"的评价。“abscence”的证据来阐述使用这些方法的好处——选择高流量网站只是一小部分——这反应了我的观点，他们代表了一种误导和盲目的崇拜。

这篇文章介绍的技术特性在Yahoo通过实践以及有问题的技术代码到今天为止我们还在使用。你可能有兴趣阅读Jonathan Snook的《Decoupling HTML From CSS》、Tim Huegdon的《On HTML Elements Identifiers》和Robin Rendle的《Atomic Design With Sass》等等。请记住：一些提到的技术并不认为是最佳实践。根据Thierry Koblentz的《Challenging CSS Best Practices》所译,介绍作者是如何挑战最佳CSS实践，希望大家会喜欢。

前端面试总是有很多同学讨论，面试官会问什么样的面试题？被面的人怎么回答面试问题？但很少有人会从面试题中深挖有价值的知识，换句话说有很多同学只是面对着如何回答面试官的问题，却忽略面试官想通过试题了解你的信息。当然，如果你处在一个需要面试别人有关于CSS方面技巧和知识，一时想起来还真有点难。根据Chris Coyier的《Interview Questions and Exercises About CSS》所译，整理在一起，提供给大家参考。

HTML的表格的每一个元素都做了比较完整的讲解，并附有大量的demo，带领大家一步步地全面地了解表格，并且讲解了表格的适用范围、语义化等相关问题，希望大家能透过此文对表格有一个全面的认识。

最近一直在学习Retina屏幕下图片的处理方法，从《走向视网膜（Retina）的Web时代》一文中知道了Retina这个新名词，同时知道了他是什么东东，同时也继续在探讨Retina方面的知识点，随后在《移动Web——CSS为Retian屏幕替换图片》和《使用css sprites来优化你的网站在Retina屏幕下显示》中学习了Retina屏幕下图片的设置方法，或者说技巧吧，接下来《Web设计师如何制作Retina图像》学习了Retina屏幕下的图片制作技巧。其实可以说，这几篇文章可以让我知道如何在Retina屏幕下处理图片的技巧和细节了。因为这几篇文章从概念到制作Retina屏蔽下的图片，以及Coding实现，可以说是一条龙了。这些都是自以为事，为什么呢？除了这些方法，其实还有更先进的方法，这也就是我接下来要说的事情了。

众所周知，平时在写HTML代码时，难免少不了使用Float样式，这样一来，假使您没有清除浮动，那么有浮动元素的父元素容器将元素将无法自动撑开。换句简单好理解的话来说，假如你在写CODE时，其中div.A（这个就是说页面中有一个div，并且把其命名为class="A"）中包含了两个或多个子元素div.B,div.C,div.D(这里我以三个为例)，并且此时div.B和div.C进行浮动，而div.D不进行任何浮动，此时你可以看到父元素div.A高度仅靠div.D来撑开其高度，如果您将div.A所有子元素进行浮动，当你没有清除内部浮动时，此时会导致浮动的父元素div.A无法自动撑开本身的高度。也就是说：当一个元素是浮动的，如果没有关闭浮动时，其父元素不会包含这个浮动元素，因为此时浮动元素从文档流中脱离。下面我们先来看看这两种现像的实例：