CSS魔法
# 苹果 WWDC 2013 絮语 到了这把年纪，除了苹果的发布会，几乎也没有其它理由能让我熬夜了。今晚在 [iNews.io 图文直播](http://live.inews.io/wwdc2013)、[腾讯视频原声直播](http://digi.tech.qq.com/zt2013/2013wwdc/liveen.htm)、[苹果官方视频直播](http://www.apple.com/apple-events/june-2013/) 三个地方来回切换，断断续续看完了 WWDC 2013 整场发布会。我把在 iNews.io 写的直播留言转录过来，并以此为引子展开观点。 > ### OS X 的一些更新确实很实用。 总感觉 Finder 这货跟 Windows 的资源管理器很像，作为系统原生的文件管理器，够用，但又似乎缺了点什么。这次新增的两大功能是标签页浏览（tab）和文件标签（tags），对文档管理的效率会有一定帮助。这些小功能在操作上也相当直观，各种拖拽 + 实时更新，现场演示相当行云流水。这也是苹果一贯的长处。 另一个系统级的优化是多对显示器的支持。以前玩过 MacBook Air 外接电视机，感觉...
# [译] Gulp 4.0 API 文档 > * Original: [gulp API docs #4.0](https://github.com/gulpjs/gulp/blob/4.0/docs/API.md) > * Translated by: [cssmagic](https://github.com/cssmagic) *** > #### 索引 > > * [gulp.src](#gulp.src) - Emit files matching...
> #### 简介 > > 这是我在 2013 年整理的一套笔试题，用于在面试前快速判断候选人的综合素质，要么快速了断，要么为后续的面谈提供切入点。为满足 “快速” 的要求，题型以选择题为主，确保候选人可以在 30 分钟内做完。 > > 显然，其中有些内容已经过时了。尽管如此，我相信这套题还是有一定的参考价值，今天完全公开。我会在每道题后面附上出题意图、解题思路、参考答案或评分标准。 > #### 如何评分 > > 试卷共包含 20 道题，每题 5 分，总分 100 分。候选人得分达到 50 分即可初步判定为中级前端工程师。（其实不需要等总分累计出来，在批卷过程中就能作出判断了，得分是给 HR...
# Underscore 模板引擎 API 更新 ## 语法 Underscore 的模板引擎 `_.template()` 脱胎于 jQuery 作者的作品 [Micro-Templating](http://ejohn.org/blog/javascript-micro-templating/)。但从 Underscore 1.3.3 开始，这个方法做了较大的调整，在保留旧语法的基础上，还新增支持了一个 `{variable: 'foo'}` 对象作为第三个参数。 一旦传入了这个参数，则模板（第一个参数）中的变量将不再指向待渲染数据（第二个参数）的**属性**，模板中的 `foo` 变量将直接指向待渲染数据（第二个参数）**自身**。 比如，原来的调用方法： ```js _.template('I love .', {person: 'you'});...
# [译] [PJA] [401] 类继承已经过时了 > - Original: [Classical Inheritance is Obsolete - Chapter 4. Objects - Programming JavaScript Applications](http://chimera.labs.oreilly.com/books/1234000000262/ch04.html#chcss2i1z00025eilzn6ki8ds) > - Translated by: [cssmagic](https://github.com/cssmagic) ## Classical Inheritance is Obsolete...
## 花絮与注解 #### 第 26 页 · 第四段 > 事实上，指定一个等于描边宽度的扩张值在某些浏览器中可能会得到渲染异常…… 此时描边和投影在理论上所占的范围应该是完全一样的，这里所说的 “渲染异常” 指的是投影可能会溢出描边的范围。 出现这种渲染异常的底层原因在于，描边与投影的绘制原理不同：描边是完全规则的矩形，完全对齐像素；而具有扩张效果的投影需要由元素的原始形状扩散而成。 对浏览器来说，前者更像是一种基于光栅的绘图算法，而后者更像是一种矢量算法。因此，在对待非整数像素值时，两者的行为可能存在差别——前者在渲染前会对像素长度值取整，而后者可能会接受非整数的长度值（在计算出矢量路径之后光栅化），从而引发两者之间的渲染误差。 如果浏览器的显示比例处于缩放的情况下，或者显示器是视网膜屏幕（由多个物理像素显示一个逻辑像素的高精度显示设备），又或者元素处于 CSS 动画之中，通常比较容易出现这种渲染误差。 ## 交流与答疑 （暂无）
## 花絮与注解 #### 第 221 页 ‧ 本节 这一节算是全书最烧脑的一个案例了，不过我们用一句话就可以概括它：这基本上是一个 “自转抵消公转” 的故事。 当自转周期与公转周期完全相等时，这个物体在外界看来就没有任何角度变化了，从而以一种 “平移” 的方式在围绕圆心转动。
勘误表
> #### 如何提交勘误？ > > 如果你在阅读本书的过程中发现任何错误（包括编辑、排版、翻译、技术等方面的错误），[请新开一个 issue](https://github.com/cssmagic/CSS-Secrets/issues/new) 来描述这个错误，并请在标题中注明 “提交勘误”。当编辑或译者确认为错误后，将会收录到本页面中。 > > 感谢你的严谨让这本书变得圆满，其他读者必将从中受益！ ## 中文版勘误 > #### 图标含义 > > * ✅ - 已在后续印次中修正。 > * ⚠️ - 尝试在后续印次中修正，但仍有错误。...
FAQ / 常见问题
## 这本书的中文版是什么情况？ #### 详细介绍 * [千呼万唤始出来：《CSS Secrets》简体中文版前瞻报导](http://www.cssmagic.net/blog/wx/15) #### 出版社 由国内顶尖的计算机图书公司 “图灵文化” 正式引进。 #### 译者 本书的中文版已由 “魔法哥” 翻译完成。 联系方式： * GitHub： [@cssmagic](https://github.com/cssmagic) * 微博： [@CSS魔法](http://weibo.com/cssmagic) * 知乎： [@CSS魔法](http://www.zhihu.com/people/cssmagic) * 微信公众号：...
## 交流与答疑 微信用户 **天下第二** 提问： > 我发现单个标签画饼图有一个问题，就是 100% 的状态没法显示。 > > [这篇博客](https://www.cnblogs.com/joyjoe/p/6922917.html) 用了书上的代码，如果把最下面那个图改成 `animation-delay:-100s`，本来希望是整个饼图显示 `#655` 颜色，但是实际上恢复了初始状态的绿色。 临时回复如下： 我暂时没有去深入分析原因。在不改变动画代码的前提下，最简单的变通解决办法是把 `-100s` 写成 `-99.999s`。 如果你是用脚本来写入元素的 `.style.animationDelay` 的话，在写入之前减去 `0.001` 即可；或者判断一下，当发现写入值为 `100` 时，改为 `99.999` 再写入。