8-forum_django_vue 首页

<template>
    <div>



        <el-carousel height="500px">

            <el-carousel-item  >
                <img   style="width: 100%; height: 500px;">
            </el-carousel-item>

        </el-carousel>

        <!-- ===============  Package  area start =============== -->
        <div class="package-area pt-120">
            <div class="container">
                <div class="row">
                    <div class="col-lg-9 col-md-9 col-sm-9">
                        <div class="section-head pb-40">
                            <h5>最近大家都在讨论</h5>
                            <h2>热门话题</h2>
                        </div>
                        帖子列表
                    </div>
                    <div class="col-lg-3 col-md-3 col-sm-3">
                        <h4 >点赞最高评论</h4>


                        评论列表
                    </div>
                </div>


            </div>
        </div>
        <!-- ===============  Package  area end =============== -->

        <div class="feature-area mt-120 p-80">
            <div class="container">
                <div class="row">
                    <div class="col-lg-12 col-md-12 col-sm-12">
                        <div class="section-head pb-60">
                            <h5>实时了解网站动态</h5>
                            <h2>网站公告或通知</h2>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-12 col-md-12" >
                        公告通知列表

                    </div>
                </div>
            </div>
        </div>





    </div>
</template>

<style scoped>
  .imgsdiv{height: 110px; overflow: hidden;}
    .imgsdiv .imgsitem{width: 100px;height:100px;
        overflow: hidden; float: left;margin-right: 10px;background: #dddddd;text-align: center;border-radius: 5px;}
    .imgsdiv .imgsitem img{ width: 100px; height: 100px;}
    .txx{width: 90px;height: 90px;border-radius: 50%;}
    .pftx{width: 50px;height: 50px;border-radius: 50%;margin-right: 10px; }
    .agile-post{font-size: 12px;color: #666;}

</style>