# 前言

本文是在自己重新开始学习CSS的过程中看到的，与其说它是讲如何深入学习CSS，更多的是警醒的作用，看了文章之后，才真正认清自己的浮躁，也庆幸自己回头恶补。本文不涉及技术，但是希望大家都能看一看。

# 前言

这篇文章，是在前几天逛知乎的时候看到的文章，觉得很棒，正好也有这个需求，想向不了解前端的人介绍何为“前端”。不然，自己所在的群体中好像很少人能明白我一天到晚钻研的东西是什么。下面与大家分享。

ps：本文为 PPT 演讲的形式所作的图文介绍，图片较多。

本文转自知乎：前端 101：给不了解前端的同学讲前端 本演讲原作者css魔法，文末有作者简介

# 前言

元素的水平及垂直居中是在写CSS样式中最常遇到的问题之一。相信会CSS的同学肯定都有自己的解决方法，但是并不一定都能熟练运用，并且知道其中原理。下面，我就将自己总结的实现方法分享给大家。 ps：重点是第四，疑惑在第三，第一、第二也较常用

为本文制作的demo：元素居中显示

# 前言

讲讲布局，传统的布局，是基于盒子模型，依赖 display + position + float属性。它对于特殊的布局非常不方便，如：垂直居中。

Flex 布局是 W3C 在 2009 年提出的新方案，可以简便、完整、响应式地实现各种页面布局。已经得到所有浏览器的支持。是未来布局的首选方案。下面就跟大家介绍Flex布局。

# 前言

原文是在前面对transform引起的z-index“失效”探究过程中找到的，非常棒，所以转载分享。本文大多摘自原文，进行了压缩，也加入了我自己的理解，希望对大家有帮助。

默认情况下，网页内容是没有偏移角的垂直视觉呈现，当内容发生层叠的时候，一定会有一个前后的层叠顺序产生。

我们大家可能都熟悉CSS中的z-index属性，需要跟大家讲的是，z-index实际上只是CSS层叠上下文和层叠顺序中的一叶小舟。