vue-beauty 的v-data-table数据单元不换行
生活随笔
收集整理的這篇文章主要介紹了
vue-beauty 的v-data-table数据单元不换行
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
原因由于css樣式
.ant-table-tbody>tr>td, .ant-table-thead>tr>th {padding: 16px 8px;word-break: keep-all;white-space: nowrap; /*強制不換行*/ }只需覆蓋white-space的值就可以
如:
.ant-table-tbody>tr>td {white-space:normal }?
補充知識:
一、white-space語法與結構?
1、white-space語法:
white-space : normal nowrap?
2、white-space參數:
normal : 默認處理方式
nowrap : 強制在同一行內顯示所有文本,直到文本結束或者遭遇br標簽對象才換行。DIVCSS5推薦使用white-space:nowrap強制不換行。
3、white-space說明:
white-space設置或檢索對象內文本顯示方式。通常我們使用于強制一行顯示內容
?
通常我們使用white-space:nowrap強制文本文字內容不換行,在對象內一行顯示完所有文字內容。
二、white-space總結
????日常我們為了讓文字內容在一行內顯示完,哪怕寬度不夠也不能換行,我們可以使用white-space樣式,但如果遇到了html br強制換行標簽,無論是設置white-space與否都會被<br>強制換行。
?
參考:
http://www.divcss5.com/rumen/r401.shtml
總結
以上是生活随笔為你收集整理的vue-beauty 的v-data-table数据单元不换行的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 星河欲转千帆舞上一句 星河欲转千帆舞出自
- 下一篇: Vue组件异步加载