<div class="swiper mySwiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="author-box">
<div class="author-photo zTopBetween">
<a href=""><img src="images/author1.png"></a>
</div>
<div class="author-grid">
<div class="author-name ellipsis"><a href="">艾四林</a></div>
<div class="author-info">
<div class="author-item">
<span class="author-label">组织机构</span> 清华大学
</div>
<div class="author-item">
<span class="author-label">职称</span> 清华大学教授、博士生导师
</div>
</div>
</div>
</div>
</div>
<div class="swiper-slide">
<div class="author-box">
<div class="author-photo zTopBetween">
<a href=""><img src="images/author1.png"></a>
</div>
<div class="author-grid">
<div class="author-name ellipsis"><a href="">艾四林</a></div>
<div class="author-info">
<div class="author-item">
<span class="author-label">组织机构</span> 清华大学
</div>
<div class="author-item">
<span class="author-label">职称</span> 清华大学教授、博士生导师
</div>
</div>
</div>
</div>
</div>
<div class="swiper-slide">
<div class="author-box">
<div class="author-photo zTopBetween">
<a href=""><img src="images/author1.png"></a>
</div>
<div class="author-grid">
<div class="author-name ellipsis"><a href="">艾四林</a></div>
<div class="author-info">
<div class="author-item">
<span class="author-label">组织机构</span> 清华大学
</div>
<div class="author-item">
<span class="author-label">职称</span> 清华大学教授、博士生导师
</div>
</div>
</div>
</div>
</div>
<div class="swiper-slide">
<div class="author-box">
<div class="author-photo zTopBetween">
<a href=""><img src="images/author1.png"></a>
</div>
<div class="author-grid">
<div class="author-name ellipsis"><a href="">艾四林</a></div>
<div class="author-info">
<div class="author-item">
<span class="author-label">组织机构</span> 清华大学
</div>
<div class="author-item">
<span class="author-label">职称</span> 清华大学教授、博士生导师
</div>
</div>
</div>
</div>
</div>
<div class="swiper-slide">
<div class="author-box">
<div class="author-photo zTopBetween">
<a href=""><img src="images/author1.png"></a>
</div>
<div class="author-grid">
<div class="author-name ellipsis"><a href="">艾四林</a></div>
<div class="author-info">
<div class="author-item">
<span class="author-label">组织机构</span> 清华大学
</div>
<div class="author-item">
<span class="author-label">职称</span> 清华大学教授、博士生导师
</div>
</div>
</div>
</div>
</div>
<div class="swiper-slide">
<div class="author-box">
<div class="author-photo zTopBetween">
<a href=""><img src="images/author1.png"></a>
</div>
<div class="author-grid">
<div class="author-name ellipsis"><a href="">艾四林</a></div>
<div class="author-info">
<div class="author-item">
<span class="author-label">组织机构</span> 清华大学
</div>
<div class="author-item">
<span class="author-label">职称</span> 清华大学教授、博士生导师
</div>
</div>
</div>
</div>
</div>
</div>
<div class="swiper-pagination"></div>
</div>
<script>
var swiper = new Swiper(".mySwiper", {
slidesPerView: 1,
spaceBetween: 10,
pagination: {
el: ".swiper-pagination",
clickable: true,
},
breakpoints: {
1: {
slidesPerView: 2,
},
1200: {
spaceBetween: 20,
slidesPerView: 4,
},
},
});
</script>