课堂笔记

一、布局的原则

先分大块，再分小块；先横再竖

二、几个1→n的问题

1.文本折叠

（1）单行折叠

white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;

（2）多行折叠

display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
text-overflow: ellipsis;

2.垂直居中

（1）单行文本

height: 400px;
line-height: 400px;

（2）多行文本

/*固定高度*/
display: flex;
align-items: center;  /*垂直居中*/

/*不固定高度*/
padding-top: 150px;
padding-bottom: 150px;