Skip to content

yjh30/flexbox.css

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

7 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Installation
npm install flexbox.css --save
Api
require('flexbox.css');
CSS Class
.flex-row               // 主轴为x轴,弹性元素垂直居中
.flex-row-between       // 主轴为x轴,弹性元素两端对齐,适合做app头部,左端(返回),中部(标题),右端(链接)
.flex-column            // 主轴为y轴,弹性元素垂直居中
.flex-column-between    // 主轴为y轴,弹性元素两端对齐
.flex-center            // 弹性元素水平垂直居中
.flex-item-scroll-x         // 弹性元素flex:1,且设置了overflow-x: auto;
.flex-item-scroll-y         // 弹性元素flex:1,且设置了overflow-y: auto;

.flex-cell              // 删格布局,支持10列,flex-wrap:wrap;
.flex-cell .col-1       // 弹性元素width:100%;
.flex-cell .col-2       // 弹性元素width:50%; 以此类推
.flex-cell .col-3       // ...
.flex-cell .col-4
.flex-cell .col-5
.flex-cell .col-6
.flex-cell .col-7
.flex-cell .col-8
.flex-cell .col-9
.flex-cell .col-10