弹性盒子布局 display: flex；

弹性盒子布局 display: flex;

1.居中设置

设置如下参数（父级元素必须有display: flex;），第一级元素呈现居中样式

display: flex;
/*
center:水平居中
space-between：两端对齐，项目之间的间隔都相等
flex-end:右对齐
space-around：每个项目两侧的间隔相等。所以，项目之间的间隔比项目与边框的间隔大一倍。
space-evenly：项目是分布的，以便任何两个项目之间的间距（和边缘的空间）相等。
*/
justify-content: center;
/* 竖直居中 */
align-items: center;

2.比例排版

父元素中必须要有display: flex;，第一级元素的同级元素设置入下值，表示按照2:3的水平大小排列

.myall_1{
    flex:2;
    background-color:  #cceeff;
}
.myall_2{
    flex:3;
    background-color:  #b3ffe0;
}

3.设置文本指定行数后隐藏

 display: -webkit-box;
 overflow: hidden;
 -webkit-box-orient: vertical;
/*表示文本2行后隐藏*/
 -webkit-line-clamp: 2;