signal_web/src/components/Total.vue

<template>
    <div class="total">
        <div class="other-people">
            <div class="image-border image-border1"></div>
            <div class="image-border image-border2"></div>
            <div class="image-border image-border3"></div>
            <div class="image-border image-border4"></div>
            <div class="other-people-title">
                实时监测
            </div>
            <div class="totalContianer">
                <div class="tlt">
                    <h5>正在监测</h5>
                    <BigRader></BigRader>
                </div>
                <div class="trt"></div>
            </div>
        </div>
    </div>
</template>

<script>
    import BigRader from '@/components/BigRader.vue'
    export default {
        components: {
            BigRader
        }
    }
</script>

<style scoped>
    .other-people {
        width: 976px;
        height: 481px;
        margin-left: 0;
        overflow: hidden;
        background: #000F2A;
    }
    ul,li {
        list-style: none;
        padding: 0;
        margin: 0;
    }
    .totalContianer {
        width: 100%;
        overflow: hidden;
        display: block;
        margin: 0 auto;
        margin-top: 55px;
    }
    .totalContianer .tlt {
        width: 50%;
        float: left;
    }
    .totalContianer .trt {
        width: 50%;
        float: right;
    }
    .totalContianer h5 {
        width: 126px;
        height: 26px;
        line-height: 26px;
        text-align: center;
        color: #6DC1FF;
        font-size: 14px;
        margin: 0 auto;
        margin-bottom: 19px;
        background: url("../assets/img/main/title.png")top center no-repeat;
        background-size: 100% 100%;
    }
</style>