MainCon.vue 1.93 KB
<style>
.demo-carousel {
    height: 400px;
    line-height: 400px;
    text-align: center;
    color: #fff;
    font-size: 20px;
    background: #506b9e;
}
</style>
<template>
    <div>
        <Alert show-icon
               style="width:100%">
            最新公告
            <template slot="desc">消息提示的描述文案消息提示的描述文案消息提示的描述文案消息提示的描述文案消息提示的描述文案</template>
        </Alert>


        <Row :gutter="16">
            <Col span="8">
            <Card>
                <p slot="title"  style="font-size:15px">接入指南</p>
                <ul class="maincon-cart-ul">
                    <li v-for="n in 4">这里是内容-------{{n}}</li>
                    <li>更多</li>
                </ul>
            </Card>
            </Col>
            <Col span="8">
            <Card>
                <p slot="title"  style="font-size:15px">平台规则</p>
                <ul class="maincon-cart-ul">
                    <li v-for="n in 4">这里是内容-------{{n}}</li>
                    <li>更多</li>
                </ul>
            </Card>
            </Col>
            <Col span="8">
            <Card>
                <p slot="title"  style="font-size:15px">基础技术</p>
                <ul class="maincon-cart-ul">
                    <li v-for="n in 4">这里是内容-------{{n}}</li>
                     <li>更多</li>
                </ul>
            </Card>
            </Col>
        </Row>
    <Row style="margin-top:20px">
        <Col span="24">
        <Card>
                <p slot="title"  style="font-size:15px">常用工具</p>
                <ul class="maincon-cart-ul">
                    <li v-for="n in 4">这里是内容-------{{n}}</li>
                </ul>
            </Card>
        </Col>
    </Row>
    </div>
</template>
<style>
.maincon-cart-ul li{
    padding: 15px 0 10px 0;
    border-bottom: 1px #e3e8ee dashed;
}
</style>