关于CSS 的文章：
所有文章
周骅，前端研发，目前就职于字节跳动。
更优雅地绘制阴影
Box-shadow 虽然是一个 css3 的属性，但由于浏览器支持不错，且用它来营造一种立体感、层次感着实方便，这让它成为了互联网上随处可见的 css3 特效。不过我感觉想写好阴影不是一件容易的事情。至少我常常摸索半天，写出来的阴影却总…
别说不可能，Node.js 中实现 sleep
Node.js 最让人不爽的就是其单线程特性，很多事情没法做，对 CPU 密集型的场景，性能也不够强劲。很长一段时间，我想在 javascript 语言框架下寻求一些解决方案，解决无法操作线程、性能差的问题。曾经最让我印象深刻的方案是 f…
必会 CSS3 技能：background-clip/background-origin
CSS3 中新增了许多 background 类的属性。今天就来聊聊 background-clip 和 background-origin。为什么把它们俩放一起说呢？因为它们俩很“默契”地拥有相同的属性值。 background-cli…
padding、margin 纵向取值问题
今天要说一个很基础，但被我自己忽略至今的一个简单问题：padding、margin 在纵向取值为百分数时，它们相对的是父元素的高度吗？ 这个问题之所以被忽略，是因为使用场景有限。因为在布局的时候，我们通常只关注宽度，流式布局、响应式布局中…
canvas 元素的宽高
设置一个元素的尺寸，推荐的做法是通过css设置其 和 。不过今天我们说说一个特例：。本文内容比较简单，我不做示例。 常见的设置 元素尺寸有两种方法。 给 元素设置属性，例如： 给 对象设置属性，例如： 不过如果你采用css来控制：…
另辟蹊径复制样式
技能get 先说一个需求，我想给一个元素应用另外一个指定元素的样式，应该怎么做？对于一个特定的项目，我想通常做法是规范代码风格，直接把 class 复制过来就可以了。但现实情况可能并不会如此简单。比如我们假定这个指定元素是不可预测的，它的…
CSS 性能优化系列之加载原理
无论是一位前端开发人员，还是一位产品设计人员，永远需要把用户体验放在第一位。只有良好的用户体验才会带来用户的持续关注和产品使用。那么，对于网站的设计来说，良好的用户体验又是如何建立的呢？因素很多，例如快速响应、良好交互、配色和谐、高易用性…
网页中元素实现水平居中的方法
网页中元素居中的需求很普遍，今天就要谈谈相对比较简单，使用场合更多的水平居中。 行级元素居中 我们知道 css 中有一个 的属性来定义子元素的水平对齐，不过它仅对行级元素生效。一种思路就是我们将想要居中的元素规定成 或 元素。 注意…