element plus表格的表頭和內(nèi)容居中的實(shí)現(xiàn)代碼
需求
對(duì)于 element-plus 中的 table 進(jìn)行表頭和內(nèi)容的居中顯示
分析
單列的表頭和內(nèi)容居中 :
在對(duì)應(yīng)的那一列加上align=“center” 即可
<el-table-column prop="name" label="商品名稱" align="center" />
表格的所有列表的頭和內(nèi)容居中:
在el-table上添加下面兩行即可
:cell-style=“{ textAlign: ‘center’ }”
:header-cell-style=“{ ‘text-align’: ‘center’ }”
<el-table fit :cell-style="{ textAlign: 'center' }" :data="tableData" style=" width: 100%" height="350" :header-cell-style="{ background: '#f7f7f7', color: 'rgba(0,0,0,.85)', 'font-weight': '500', 'text-align': 'center' }" v-loading="loading" > <el-table-column prop="name" label="商品名稱" /> </el-table>
到此這篇關(guān)于element plus表格的表頭和內(nèi)容居中的文章就介紹到這了,更多相關(guān)element plus表格內(nèi)容居中內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
javascript延時(shí)重復(fù)執(zhí)行函數(shù) lLoopRun.js
javascript延時(shí)重復(fù)執(zhí)行函數(shù) lLoopRun.js...2007-06-06jQuery與原生JavaScript選擇HTML元素集合用法對(duì)比分析
這篇文章主要介紹了jQuery與原生JavaScript選擇HTML元素集合用法,結(jié)合實(shí)例形式對(duì)比分析了jquery與原生JavaScript選擇頁(yè)面HTML相關(guān)操作方法、注意事項(xiàng)及運(yùn)行效率,需要的朋友可以參考下2019-11-11js實(shí)現(xiàn)點(diǎn)擊切換TAB標(biāo)簽實(shí)例
這篇文章主要介紹了js實(shí)現(xiàn)點(diǎn)擊切換TAB標(biāo)簽的方法,涉及javascript鼠標(biāo)點(diǎn)擊事件及頁(yè)面元素的遍歷技巧,需要的朋友可以參考下2015-08-08js中for...in循環(huán)對(duì)象時(shí)輸出key值順序混亂問(wèn)題解決
很久之前就有前輩告訴我用for...in循環(huán)對(duì)象屬性的順序不是固定的,xiam?這篇文章主要給大家介紹了關(guān)于js中for...in循環(huán)對(duì)象時(shí)輸出key值順序混亂問(wèn)題解決方法,需要的朋友可以參考下2023-11-11Javascript中arguments用法實(shí)例分析
這篇文章主要介紹了Javascript中arguments用法,實(shí)例分析了javascript利用arguments實(shí)現(xiàn)模擬重載功能,需要的朋友可以參考下2015-06-06利用原生JS實(shí)現(xiàn)歡樂(lè)水果機(jī)小游戲
這篇文章主要介紹了利用原生JS實(shí)現(xiàn)歡樂(lè)水果機(jī)小游戲,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-04-04帶大家了解一下JavaScript常見的五個(gè)內(nèi)存錯(cuò)誤
這篇文章主要為大家介紹了JavaScript常見的五個(gè)內(nèi)存錯(cuò)誤,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下,希望能夠給你帶來(lái)幫助2022-01-01