版权声明： https://blog.csdn.net/qq_36979290/article/details/82348730
flex 弹性布局特性详解：http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html
问题：容器内的内容平均分布后danh单行文本溢出有问题，单行文本或多行文本溢出，用省略号显示，单行文本white-space:nowrap 没反应问题
解决办法：flex布局特性，使用多行文本溢出省略号显示，解决单行文本省略号的问题
css代码:
#box{
width: 100%;
display: -webkit-flex;
display: -webkit-box;
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
}
.boxInfo{
flex-basis:100%;/*平均分布方法1*/
/*-webkit-box-flex: 1;
-webkit-flex: 1;
flex:1;*//*平均分布方法2*/
height: 20px;
font-size:14px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp:1;
-webkit-box-orient:vertical;
/*white-space: nowrap;*//*单行文本溢出会出现问题这条代码，所以用多行文本溢出来避免*/
}html代码:
<body>
<div id="box">
<div class="boxInfo" style="background-color: red">
<h3>文字文字文字文字费劲啊就是靠金卡吉萨快点见到我的哈哈吓唬大家是拉到了酒啊</h3>
</div>
<div class="boxInfo" style="background-color: green">
<h3>咯大开杀戒的就看动漫几乎</h3>
</div>
<div class="boxInfo" style="background-color: orange">
<h3>加紧对我看见看见撒娇就发哈凯撒科技圣诞节卡加斯哈市的好阿萨德哈哈撒恒大和撒谎交互设计的很婚纱哈市的好结婚</h3>
</div>
</div>
</body>