8000 Added images in carousel · umarhasnain/HTML-CSS-Compitition@9b0e40f · GitHub
[go: up one dir, main page]

Skip to content

Commit 9b0e40f

Browse files
committed
Added images in carousel
0 parents  commit 9b0e40f

8 files changed

+116
-0
lines changed

.gitattributes

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
# Auto detect text files and perform LF normalization
2+
* text=auto

images/download.jpg

11.3 KB
Loading

images/ecomerce-bag.avif

25.7 KB
Binary file not shown.

images/ecommerce-2140603_640.jpg

24.6 KB
Loading
Loading
Loading
Loading

index.html

Lines changed: 114 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,114 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<title>HTML & CSS Compitition</title>
7+
<link
8+
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css"
9+
rel="stylesheet"
10+
integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN"
11+
crossorigin="anonymous"
12+
/>
13+
</head>
14+
<body>
15+
<nav class="navbar navbar-expand-lg bg-body-tertiary" id="navbar">
16+
<div class="container-fluid">
17+
<a
18+
class="navbar-brand"
19+
href="#"
20+
style="color: #2756e2; font-weight: bold"
21+
>Ecommerce</a
22+
>
23+
<button
24+
class="navbar-toggler"
25+
type="button"
26+
data-bs-toggle="collapse"
27+
data-bs-target="#navbarSupportedContent"
28+
aria-controls="navbarSupportedContent"
29+
aria-expanded="false"
30+
aria-label="Toggle navigation"
31+
>
32+
<span class="navbar-toggler-icon"></span>
33+
</button>
34+
<div class="collapse navbar-collapse" id="navbarSupportedContent">
35+
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
36+
<li class="nav-item">
37+
<a class="nav-link active" aria-current="page" href="#">Home</a>
38+
</li>
39+
<li class="nav-item">
40+
<a class="nav-link active" href="#"
41+
>Category</a
42+
>
43+
</li>
44+
<li class="nav-item">
45+
<a
46+
class="nav-link active"
47+
aria-current="page"
48+
href="#"
49+
>Details</a
50+
>
51+
</li>
52+
<li class="nav-item">
53+
<a
54+
class="nav-link active"
55+
aria-current="page"
56+
href="#"
57+
>Payment</a
58+
>
59+
</li>
60+
</ul>
61+
<form class="d-flex" role="search">
62+
<input
63+
class="form-control me-2"
64+
type="search"
65+
placeholder="Search"
66+
aria-label="Search"
67+
/>
68+
<button class="btn" id="search_btn" type="submit">Search</button>
69+
</form>
70+
</div>
71+
</div>
72+
</nav>
73+
74+
<div class="herosection">
75+
<div id="carouselExample" class="carousel slide">
76+
<div class="carousel-inner">
77+
<div class="carousel-item active">
78+
<img src="./images/online-shop-german-web-slider-f1cc4a.png" class="d-block w-100" alt="..." />
79+
</div>
80+
<div class="carousel-item">
81+
<img src="./images/online-store-sale-slider-template-a3cc06.png" class="d-block w-100" alt="..." />
82+
</div>
83+
<div class="carousel-item">
84+
<img src="./images/shop-online-web-slider-design-e2862a.png" class="d-block w-100" alt="..." />
85+
</div>
86+
</div>
87+
<button
88+
class="carousel-control-prev"
89+
type="button"
90+
data-bs-target="#carouselExample"
91+
data-bs-slide="prev"
92+
>
93+
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
94+
<span class="visually-hidden">Previous</span>
95+
</button>
96+
<button
97+
class="carousel-control-next"
98+
type="button"
99+
data-bs-target="#carouselExample"
100+
data-bs-slide="next"
101+
>
102+
<span class="carousel-control-next-icon" aria-hidden="true"></span>
103+
<span class="visually-hidden">Next</span>
104+
</button>
105+
</div>
106+
</div>
107+
108+
<script
109+
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"
110+
integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL"
111+
crossorigin="anonymous"
112+
></script>
113+
</body>
114+
</html>

0 commit comments

Comments
 (0)
0