display:flex 弹性布局在小程序里面应用很便利,但是在不同系统下不兼容,display里面的属性没有实现,去网上查了一下问题说是不同内核的问题。(不同浏览器内核不同)
解决问题的方法:在display:flex属性的css文件下加上上图对于不同内核的不同属性。基本都可以解决问题了。
大家也都知道 文字太长超过容器的长度的时候会发生溢出。这时候如果你需要这个文本在一行显示不进行换行就写上如下图所示的代码:
这个里面也需要注意到兼容问题。
然后,多行出现省略号:
其中 -webkit-line-clamp:4的意思就是将文本分为四行。然后再第四行的末尾出现省略号。效果如下:
然后 还有一个css样式 : white-space: nowrap, 意思是强制不换行,但是如果下面含有子容器的时候 在子容器的样式里面写上:display: inline-block,