<!--轮播图-->
 <div style="top:130px;" class="layui-carousel" id="ID-carousel-demo-1">

     <div carousel-item>

         <div><img src="http://tool.niunan.net/genimg?width=1080&height=720&fontcolor=d3d3d3&bgcolor=f7f7f7" /></div>

         <div><img src="http://tool.niunan.net/genimg?width=1080&height=720&fontcolor=d3d3d3&bgcolor=f7f7f7" /></div>

         <div><img src="http://tool.niunan.net/genimg?width=1080&height=720&fontcolor=d3d3d3&bgcolor=f7f7f7" /></div>


     </div>

 </div>
 
 <style>
   .layui-carousel {
      height: 680px;
  }
      .layui-carousel img {
          width: 100%;
          height: 100%;
          object-fit: cover;
      }
      
       @media (max-width: 480px) {
     .layui-carousel {
         height: 180px !important;  /* 手机小屏的时候就限制高度是180px */
     }
     }
 </style>

<script>
 layui.use(function () {

     var carousel = layui.carousel;

     // 渲染 - 常规轮播 
     carousel.render({

         elem: '#ID-carousel-demo-1',

         width: '100%',
         height:'680px'

     });
      

 });
</script>