vue3解决el

2024-07-10 08:59| 来源: 网络整理| 查看: 265

问题描述：在实际开发中，经常会使用Descriptions描述列表来展示内容，而有时某个字段内容太多，就会导致如下图的问题，因此本文就主要介绍如何解决该问题。

解决方案代码：

{{ remark }} :deep() { .el-descriptions-item__content { max-width: 295px; // 如果下方最大宽度不起效果，就加上此样式 } } .my-label { width: 200px; color: #999; font-weight: normal; background: #fff; } .my-class { max-width: 295px; // 给内容增加最大宽度 word-break: break-all; // 让内容超出列宽时自动换行显示 word-wrap: break-word; }

解决label被挤压换行问题的主要点是：给内容列一个最大宽度；

而解决内容过多换行问题的主要点就是：给内容列添加 word-break: break-all; word-wrap: break-word;代码

最后效果如图所示：

【本文地址】

公司简介

联系我们