vue el-row中ul間距問題
更新時間：2024年08月07日 08:48:14 作者：笨爪
這篇文章主要介紹了vue el-row中ul間距問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
vue el-row中ul間距
在 el-row 中使用 ul 標(biāo)簽，可以通過為 ul 添加類似 margin: 0 20px; 的樣式來調(diào)整間距。
例如：
.my-ul {
margin: 0 20px;
}然后在模板中使用這個類：
<el-row>
<ul class="my-ul">
<!-- 列表項(xiàng) -->
</ul>
</el-row>這樣就可以在 el-row 中調(diào)整 ul 標(biāo)簽的間距了。
el-row的gutter注意事項(xiàng)
<el-row :gutter=20> <el-col :span=8></el-col> <el-col :span=8></el-col> <el-col :span=8></el-col> </el-row>
注意：
gutter會使el-row的容器寬度增加20px，因?yàn)榇嬖趍argin-left:-10px、margin-right:-10px，在全屏寬度時候可能會導(dǎo)致出現(xiàn)橫向滾動條。
可在el-row父元素設(shè)置overflow:hidden;
總結(jié)
以上為個人經(jīng)驗(yàn)，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
springboot+vue實(shí)現(xiàn)文件上傳下載
這篇文章主要為大家詳細(xì)介紹了springboot+vue實(shí)現(xiàn)文件上傳下載，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-11-11
Vue axios全局?jǐn)r截 get請求、post請求、配置請求的實(shí)例代碼
這篇文章主要介紹了Vue axios全局?jǐn)r截 get請求、post請求、配置請求的實(shí)例代碼,非常不錯，具有一定的參考借鑒價值，需要的朋友可以參考下2018-11-11
這篇文章主要介紹了在Vue中使用WebScoket，網(wǎng)絡(luò)的不穩(wěn)定而斷開連接，webscoket不會出現(xiàn)異常，下面就一起進(jìn)入文章看看吧2022-01-01
Vue3 Ref獲取真實(shí)DOM學(xué)習(xí)實(shí)戰(zhàn)
這篇文章主要為大家介紹了Vue3 Ref獲取真實(shí)DOM學(xué)習(xí)實(shí)戰(zhàn)示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-06-06
這篇文章主要介紹了JavaScript優(yōu)選七個用于vue開發(fā)庫，借助開源庫加速Vue項(xiàng)目的開發(fā)進(jìn)度是現(xiàn)代前端開發(fā)比較常見的方式，平常收集一些JavaScript庫介紹，在遇到需要的時候可以信手拈來2023-02-02
Vue3中按需引入ECharts詳細(xì)步驟(一看就會)
新項(xiàng)目采用Vue3作為前端項(xiàng)目框架,避免不了要使用echarts,這篇文章主要給大家介紹了關(guān)于Vue3中按需引入ECharts的相關(guān)資料,需要的朋友可以參考下2023-09-09
這篇文章主要為大家詳細(xì)介紹了如何在Vue項(xiàng)目中使用flv.js播放視頻,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2024-04-04
這篇文章主要給大家介紹了關(guān)于Vue開發(fā)中常見的套路和技巧的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-11-11
今天小編就為大家分享一篇vue動態(tài)改變背景圖片demo分享，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-09-09
vue2模擬vue-element-admin手寫角色權(quán)限的實(shí)現(xiàn)
本文主要介紹了vue2模擬vue-element-admin手寫角色權(quán)限的實(shí)現(xiàn)，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-07-07