-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
39 lines (39 loc) · 1.86 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./style.css">
<script src="script.js" defer></script>
<title>Carousel</title>
</head>
<body>
<section class="Beautiful-photos">
<div class="carousel" data-carousel>
<button class="carousel-button prev" data-carousel-button="prev" >⇐</button>
<button class="carousel-button next" data-carousel-button="next" >⇒</button>
<ul data-slides>
<li class="slide" data-active>
<img src= "https://wallpapercave.com/wp/wp2894284.jpg" class="img" alt="Nature image #1">
</li>
<li class="slide">
<img src="https://wallpapercave.com/wp/wp5241126.jpg" class="img" alt="Nature image #2">
</li>
<li class="slide">
<img src= "https://www.teahub.io/photos/full/275-2758146_shining-sunrise-nature-sky-background-golden-most-beautiful.jpg" class="img" alt="Nature image #3">
</li>
<li class="slide">
<img src="https://wallup.net/wp-content/uploads/2016/01/176478-sunset-nature-reflection-clouds-sea-water-sky.jpg" class="img"alt="Nature image #4">
</li>
<li class="slide">
<img src="https://www.publicdomainpictures.net/pictures/120000/velka/twilight-sky-and-sea-1434268776Fkl.jpg"class="img" alt="Nature image #5">
</li>
<li class="slide">
<img src="https://www.teahub.io/photos/full/196-1968172_full-hd-sky.jpg"class="img" alt="Nature image #6">
</li>
</ul>
</div>
</section>
</body>
</html>