添加小程序,兑换各种视频教程/数据资源。

 

1. 获取标签的宽高:this.$refs.image.clientHeight/clientWidth。

2. 设置标签的宽高:this.$refs.content.$el.style.top="12px"

<div >
    <div ref="image" class="image"></div>
    <div ref="content" class="content"></div>
</div>

<style>
    .image{
        width:100%;
        height:0;
        padding-top:70%;
    }
    .content{
        position:absolute;  
        width:100%;
        top:0;
        left:0;
        right:0;
        bottom:0;  
    }
    
</style>

<script>
    export default{
        mounted(){
            setTimeout(()=>{
                this.$refs.content.$el.style.top=`${this.$refs.image.clientHeight}px`
            },20)
        }
    }

</script>

Logo

基于 Vue 的企业级 UI 组件库和中后台系统解决方案,为数万开发者服务。

更多推荐