fefz / miscellaneous Goto Github PK

• box-sizing 属性有常用的俩个值

  • content-box： width和height包含padding和border的值，等同于标准盒子模型

  • padding-box： width和height包含padding的值

  • border-box： width和height不包含padding和border的值

  • 

---

• 使用flex实现垂直居中布局

  .vertical-container {
    height: 200px;
    display: flex;
    display: -webkit-flex;
    align-items: center; // 垂直居中
    -webkit-align-items: center;
    justify-content: center; // 水平居中
    -webkit-justify-content: center;
  }

---

PRE-STEP 0️⃣

Environment Installation 🍦

[windows] : use Babun that provide Cygwin environment and bundle some useful tools instead of CMD

• Node must be required
• $ npm i -g create-react-app that is a react sead project scaffold created by React

Knowledgemap

• This is dva.js principle but have some ES6 features can learn
• ES6 Book written by ruanyifeng

---

STEP1 1️⃣

What

• A JAVASCRIPT LIBRARY FOR BUILDING USER INTERFACES

Why

• Component is base on JAVASCRIPT instead of template , can easily pass data or keep state
• NO DOM , friendly to devloper
• Shadow DOM, Component, toward future
• learn once, use anywhere

---

STEP2 2️⃣

TODO ...