<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>文章图片缩略展示</title>
<link rel="stylesheet" href="./style.css">
</head>
<body>
<div class="carousel">
<!-- 箭头绘制 -->
<div class="carousel_nav">
<span id="moveLeft" class="carousel_arrow">
<svg class="carousel_icon" width="24" height="24" viewbox="0 0 24 24">
<path d="M20,11V13H8L13.5,18.5L12.08,19.92L4.16,12L12.08,4.08L13.5,5.5L8,11H20Z"></path>
</svg>
</span>
<span id="moveRight" class="carousel_arrow">
<svg class="carousel_icon" width="24" height="24" viewbox="0 0 24 24">
<path d="M4,11V13H16L10.5,18.5L11.92,19.92L19.84,12L11.92,4.08L10.5,5.5L16,11H4Z"></path>
</svg>
</span>
</div>
<!-- 图片文章概述 -->
<div class="carousel-item carousel-item--1">
<div class="carousel-item_image"></div>
<div class="carousel-item_info">
<div class="carousel-item_cantainer">
<h2 class="carousel-item_subtitle">Dixie National Forest</h2>
<h1 class="carousel-item_title">迪克西国家森林公园</h1>
<p class="carousel-item_description">位于犹他州的南部，是从锡安公园走Highway89公路前往布莱斯峡谷的必经之路，占地将近200万英亩，横跨犹他州南部约170英里以及更广泛的地区，是大盆地和科罗拉多河之间的鸿沟。</p>
<a href="#" class="carousel-item_btn">阅读文章</a>
</div>
</div>
</div>
<div class="carousel-item carousel-item--2">
<div class="carousel-item_image"></div>
<div class="carousel-item_info">
<div class="carousel-item_container">
<h2 class="carousel-item_subtitle">Bernina Alps</h2>
<h1 class="carousel-item_title">伯尔尼纳山</h1>
<p class="carousel-item_description">瑞士东部沿著意大利边境伸展的雷蒂亚阿尔卑斯山脉(Rhaetian Alps)的一部分，景色秀丽，伯尔尼纳峰高达4,049公尺(13,284尺)。</p>
<a href="#" class="carousel-item_btn">阅读文章</a>
</div>
</div>
</div>
<div class="carousel-item carousel-item--3">
<div class="carousel-item_image"></div>
<div class="carousel-item_info">
<div class="carousel-item_container">
<h2 class="carousel-item_subtitle">Lappland</h2>
<h1 class="carousel-item_title">拉普兰</h1>
<p class="carousel-item_description">拉普兰地处芬兰最北部。这是一片充满魔幻魅力的北极地带，各种反差十分强烈。事实上，拉普兰地区的主要魅力之一就是强烈的反差：从24小时日照不断的温暖夏季，到北极光辉映下的黑暗冬日。</p>
<a href="#" class="carousel-item_btn">阅读文章</a>
</div>
</div>
</div>
<div class="carousel-item carousel-item--4">
<div class="carousel-item_image"></div>
<div class="carousel-item_info">
<div class="carousel-item_container">
<h2 class="carousel-item_subtitle">Palawan island</h2>
<h1 class="carousel-item_title">巴拉望岛</h1>
<p class="carousel-item_description">巴拉望岛是菲律宾西部岛屿，地势狭长，面积1.1785万平方公里，人口31.1548万，巴拉望岛和周围数千个小岛仍是原始的自然生态，因此被称为“海上的乌托邦”。</p>
<a href="#" class="carousel-item_btn">阅读文章</a>
</div>
</div>
</div>
<div class="carousel-item carousel-item--5">
<div class="carousel-item_image"></div>
<div class="carousel-item_info">
<div class="carousel-item_container">
<h2 class="carousel-item_subtitle">Grand Bazaar, Tehran</h2>
<h1 class="carousel-item_title">德黑兰大市集</h1>
<p class="carousel-item_description">德黑兰大市集是当地最大的市集, 货品包罗万有, 如果慢慢逛, 应该可以流年数小时, 但需要留意市集内很容易迷路, 价格比其他伊朗城市高，特别是一些纪念品。</p>
<a href="#" class="carousel-item_btn">阅读文章</a>
</div>
</div>
</div>
</div>
<!-- partial -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script><script src="./script.js"></script>
</body>
</html>
