未加該 word-break: break-all 樣式時,聯系位址資料加載完全,但是顯示不全。全選複制可以得到所有字元。
加了 word-break: break-all 樣式時,聯系位址資料加載完全,換行顯示出全部字元。
<li class="table-li">
<div class="table-li-name">職位:</div>
<div class="table-li-value" v-text="form.title ? form.title : '-'"></div>
</li>
<li class="table-li">
<div class="table-li-name">性别:</div>
<div class="table-li-value" v-text="form.gender === 0 ? '男' : '女'"></div>
</li>
<li class="table-li">
<div class="table-li-name">使用者簽名:</div>
<div class="table-li-value" v-text="form.sign ? form.sign : '-'"></div>
</li>
.table {
&-list {
width: 100%;
overflow: hidden;
}
&-li {
width: 100%;
padding: 8px 0;
overflow: hidden;
color: #303133;
&-name {
float: left;
width: 84px;
line-height: 20px;
text-align: right;
font-family: MicrosoftYaHei;
font-size: 14px;
color: #303133;
letter-spacing: 0;
}
&-value {
float: left;
width: calc(100% - 120px);
line-height: 20px;
font-family: MicrosoftYaHei;
margin-left: 14px;
font-size: 14px;
color: #303133;
letter-spacing: 0;
word-break: break-all;
}
}
&-ul {
margin: 14px 40px;
padding: 0px;
}
}