关于前端:flex盒子子元素实现文本超出部分

11次阅读

共计 445 个字符,预计需要花费 2 分钟才能阅读完成。

日常开发的时候 有时候会遇到 在 flex 布局中 心愿子元素自适应宽度 并且文本超出局部 …
因为 felx 自身的属性限度,间接像上面这种写法是不失效的
`

<view style="display:flex">
 <view style="felx:1;overflow: hidden; white-space:  nowrap; text-overflow: ellipsis;"> 用户名 </view>
 <view style="width:100px"> 编辑材料 </view>
</view>

`

分享一种写法
`

<view style="display:flex">
    <view style="felx:1;display: contents;">
        <view style="width:100%;overflow: hidden; white-space:  nowrap; text-overflow: ellipsis;"> 用户名 </view>
        </view>
    <view style="width:100px"> 编辑材料 </view>
</view>

`

正文完
 0