element-ui 柵格布局 一行五等分


24/5 = 4.8

<el-row :gutter="20" type="flex"  class="wan-row-justify-box">
                <el-col :xs='24' :md="6" :lg="{span: '4-8'}" :sm="12"  v-for="(item,index) in tvList" :key="index">
                    <div class="template_con">
                        <div class="template_info">
                            <div class="name">{{item.title}}</div>
                            <div class="label">價格:<div><span>¥{{item.price}}</span> 元</div></div>
                            <div class="btnList">
                                <div class="planBtn" @click="delTemplate(item.id)">刪除</div>
                            </div>
                        </div>
                    </div>
                </el-col>
            </el-row>

 

 
    .wan-row-justify-box {
        flex-direction: row;
        flex-wrap: wrap;
    }
    
@media screen and (min-width: 1200px) { .el-col-md-6 { width: 20%; } }

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM