fzfzcj_org_cn/components/home/Advertising.vue

<template>
    <div class="adversing" v-if="imgurl">
        <div class="inner">
            <a href="http://nzgxw.org.cn/" v-if="imgurl.image_url==null" target="_blank" :title="imgurl.introduce">
                <img :src="imgurl.thumb" :alt="imgurl.introduce" :id="imgurl.ad_tag"  data-tag="imgurl.ad_tag">
            </a>
            <a :href="imgurl.image_url" v-else :title="imgurl.introduce">
                <img :src="imgurl.image_src" :alt="imgurl.introduce" :id="imgurl.ad_tag" data-tag="imgurl.ad_tag">
            </a>
        </div>
    </div>
 


</template>

<script setup>
//import {onMounted } from 'vue';
const props = defineProps({
    imgurl: Array
});
//广告移动至客户端获取，并且按照标识单独获取
</script>

<style lang="less">
// 广告位logo
.adversing {
    width: 1200px;
    height: 90px;
    margin:0 auto;
    margin-top: 20px;
    margin-bottom: 20px;
    overflow: hidden;
    a {
        display: block;
    }
    img {
        width: 100%;
        height: 90px;
    }  
}

    @media screen and (min-width:800px){/*pc*/
         
 
    }

    @media screen and (max-width:800px){/*ipad_phone*/
         
                .adversing {
                    width: 100%;height:auto;
                    margin: 11px auto 0; 
                }
                .adversing .inner {
                    width: 100%;height:auto;
                    
                }

                .adversing a {height:auto;width:100%;}
                .adversing img {height:11vw;width:100%;display:block;}

                .adversing {display:none;}

    }

</style>