大家好，这次给大家换换口味，我们来点不一样的东西。请不要理解歪了🐶。 通过Three实现3D很容易，但这次我们通过CSS来实现3D。

前言之爆锤面试官神器 - 11 种 CSS 垂直居中 其实垂直居中主要分为了两种类型：**居中元素宽高已知** 和 **居中元素宽高未知**，那么我们就结合这两种类型来一一做举例。

在介绍新的 CSS 属性 contain 之前，读者首先需要了解什么是页面的重绘与重排。 之前已经描述过很多次了，还不太了解的可以先看看这个提高 CSS 动画性能的正确姿势。 OK，下面进入本文正题，

在实际 Web 开发过程中，总会遇到各种各样的布局。有公司同事问我这样一种布局有没有什么好的实现方式，就是一种在活动充值页非常普遍的优惠券效果，如下 首先，碰到这类布局的最佳实现肯定是mask遮罩。关于遮罩，可以看一下CSS3 Mask 安利报告。这里简单介绍一下 这里的遮罩图…

-webkit-box-reflect 是一个非常有意思的属性，它让 CSS 有能力像镜子一样，反射我们元素原本绘制的内容。 上一次写它，它的兼容性还非常非常的惨淡，但是到今天，虽然还是一个 Non-standard 的语法，但是兼容性已经大有改观，并且利用它，我们可以实现非常…

谈到 <fieldset> 与 <legend>，大部分人肯定会比较陌生，在 HTML 标签中，属于比较少用的那一批。 我最早知道这两个标签，是在早年学习 reset.css 或者 normalize.css 时，在这些重置统一代码默认样式的 CSS 中看到…

这一篇中将主要介绍未知高度容器的多种垂直居中方法，包括伪元素占位法，absolute + transform，table-cell，基于flex的等5个方案；用counter来模拟/装饰有序清单(已补充)；用table-layout来控制表格单元格宽度；用caret-color来自定义光标的样式；用user-select来禁用文本选中

目前最新最流行的前端速查表（Cheat sheet），包含：CSS3 Flexbox、ES6、jQuery 3 以及最新的 Bootstrap 4，前端人员可以将这些当作是备忘表或速记手册，使用时可以快速查阅，相当便捷。推荐收藏备用！

css有些属性容易忘记，半天不写就要去查api，有时候api还不好使，于是还是记下来以后方便用，后续会慢慢补充进来的。 可以通过input, blur事件来监听element的输入和输入完后鼠标离开。 手机video 都可以在页面中播放，而不是全屏播放了。 使用clearfix…