jchappytime/high-frequency-and-interesting-css

一些常用和有趣的CSS分享

High-Frequency-and-Insterting-CSS

1. 记录一些使用频率较高的CSS布局。当我们在拿到设计师给出来的设计图时，请首先考虑该如何布局你的页面，然后再开始开发。
2. 分享一些大神给出的有趣的CSS使用案例，学习学习，再研究一下能不能变得更有趣。

Specifications

• Element UI
• Vue(2.x) + Vuex + Vue Router
• Typescript
• less

Build Setup

Requires Node.js 6+

prepare to run in local environment

• npm install
• npm run serve
• visit http://localhost:8080

常用的CSS布局

• 1. header+main+footer的全屏布局
• 2. 带下划线的导航栏
• 3. 两栏布局
• 4. 三栏布局
• 5. 垂直居中布局

有趣的CSS布局

• 1. iCSS

high-frequency-and-interesting-css's Issues

垂直居中布局

三栏布局

3D Christmas Tree

每加一层圣诞树叶，有什么样的规律，如何缩短编写的HTML？

header+main+footer的全屏布局

如何给圣诞树添加树干（绿色）

两栏布局

跳动的神树精灵

来源

源码地址

效果图

HuaWei Phone充电效果图实现

参考

1. 华为手机充电效果