<template>
<el-row :gutter="10"><el-col :span="8"><div class="dplay_green"><div class="dplay_num_green">{{ jhdl }}</div><div class="dplay_text_green">提示文字</div></div></el-col><el-col :span="8"><div class="dplay_green"><div class="dplay_num_green">{{ jhdl }}</div><div class="dplay_text_green">提示文字</div></div></el-col><el-col :span="8"><div class="dplay_green"><div class="dplay_num_green">{{ jhdl }}</div><div class="dplay_text_green">提示文字</div></div></el-col>
</el-row>
</template><script>
export default {name: 'DplayCard',data(){return{jhdl: 1200,sjfdl: 1265,pcdl: 65,}}
}
</script><style scoped>
.dplay_text_green{width: 60%;height: 20px;line-height: 20px;text-align: center;color: #ffffff;font-size: 12px;margin: 0 20%;background: linear-gradient(to right, transparent, #1DF6CE80, transparent);
}
.dplay_green{width: 100%;height: 70px;background: url("/img/bg/dplay_green.png");background-size: 100% 100%;
}
.dplay_num_green{width: 100%;height: 36px;line-height: 36px;text-align: center;font-weight: bolder;font-size: 22px;color: #1DF6CE;padding-top: 6px;
}
.dplay_text_blue{width: 100%;height: 20px;line-height: 20px;text-align: center;color: #ffffff;font-size: 12px;
}
.dplay_green{width: 100%;height: 70px;background: url("/img/bg/dplay_green.png");background-size: 100% 100%;
}
.dplay_num_blue{width: 100%;height: 36px;line-height: 36px;text-align: center;font-weight: bolder;font-size: 22px;color: #50DBFF;
}
</style>