iview grid :gutter不起作用

Question

<template>
<div>
    <Row :gutter="16">
        <Col class="col" span="6">
            <div>col-6</div>
        </Col>
        <Col class="col1" span="6">
            <div>col-6</div>
        </Col>
        <Col class="col" span="6">
            <div>col-6</div>
        </Col>
        <Col class="col1" span="6">
            <div>col-6</div>
        </Col>
    </Row>
</div>
</template>

<script>
export default {
  
}
</script>

<style scoped>
.col {
    background: rgba(0, 153, 229, .7)
}
.col1{
    background: rgba(0,153,229,.9);
}
</style>

Answer 1

代码是对的
gutter是通过添加padding增加间距的，background-color包含padding区域，所以色块不区分，写内容的话会发现间距
官方的例子不是col添加背景色，是col里的div添加背景色，就是不包含padding的区域