模板:
<div style="
flex: 0 1 70%;
display: flex;
flex-direction: column;
justify-content: space-between;
"
>
<span style="flex: 0 1 8%">{{ $t("ngMsg.text") }}</span>
<dv-border-box-13 style="flex: 0 1 92%;display:flex;
flex-direction:column;">
<dv-scroll-board
style="width:95%;height:90%;padding-left:3%;padding-top:3%"
:config="ngMsgconfig"
ref="ngMsg"
/>
</dv-border-box-13>
</div>
CSS
.border-box-content {
.dv-scroll-board {
.header {
height: 70px;
}
}
::v-deep .rows {
::v-deep .ceil {
padding: 0 20px;
box-sizing: border-box;
white-space: normal; /* 允许文本换行 */
overflow-wrap: break-word; /* 在单词边界处换行 */
}
}
}
修改轮播rows样式不生效,但是hearder可以生效。
在组件外层包裹一个div姐可以实现文字换行
<div>
<dv-scroll-board
style="width:95%;height:90%;padding-left:3%;padding-top:3%"
:config="ngMsgconfig"
ref="ngMsg"
/>
</div>