1. 模拟table布局实现(table-cell所有单元格等高特性) ``` .Article { display: table; width: 100%; table-layout: fixed; } .Article\>li { display: table-cell; width: 200px; border-left: solid 5px currentColor; border-right: solid 5px currentColor; color: #fff; background: #4577dc; } ``` 2. 使用flex布局实现(优选方案) ``` .Article { display: flex; } .Article\>li { flex: 1; border-left: solid 5px currentColor; border-right: solid 5px currentColor; color: #fff; background: #4577dc; } ``` 3.使用负margin-bottom和正padding-bottom来实现 ``` .Article { overflow: hidden; } .Article>li { float: left; margin: 0 10px -9999px 0; padding-bottom: 9999px; background: #4577dc; width: 200px; color: #fff; } ``` 4. 使用js计算元素的最大高度赋值给其它元素 5. 使用grid布局实现