el-col使用后内部无法点击(无法获取鼠标聚焦)

笔者在前端使用vue项目的过程中，在制作了一个组件后发现，组件内部无法点击

<template>
    <el-col class="card-box">
        <el-card>
            <el-form-item label = "下载">
            <downLoad>下载的组件</downLoad>
            </el-form-item>
        </el-card>
    </el-col>
</template>

在使用多个类似写法的组件之后，发现页面内的下载组件的超链接，无法点击。打开F12之后，检查网页内的相应元素，发现上面有一层奇怪的el-col覆盖了。不是专业前端，后来经过查验，发现：

<el-col>这个标签无法单独使用，必须配合<el-row>来使用，修改如下：

<template>
    <el-row>
        <el-col class="card-box">
        <el-card>
            <el-form-item label = "下载">
                <downLoad>下载的组件</downLoad>
             </el-form-item>
        </el-card>
        </el-col>
    </el-row>
</template>