Senin, 26 September 2022

Code Html

 <html>

<head>

<meta charset="utf-8"/>

<meta content="IE-edge" http-equiv="X-UA-Compatible"/>

<meta content="width=device-width, initial-scale=1.0" name="viewport"/>

<title>Shopping Site</title>

<!--web-icon------------------->

<link href="images/logo.png" rel="shortcut icon"/>

<!--stylesheet-------------------->

<link href="css/style.css" rel="stylesheet" type="text/css"/>

<!--FontAwesome-------->

<script crossorigin="anonymous" src="https://kit.fontawesome.com/70a642cd7c.js"></script>

</head>

<body>

<!--main-section--------------->

<section class="main">

<!--logo------------->

<div class="logo">

<a href="#"><font>LO</font>GO</a>

</div>

<!--side-menu------------->

<div class="side-box">

<!--search------------->

<div class="search">

<!--icon----------->

<i class="fas fa-search"></i>

<input placeholder="Search" type="text" />

</div>

</div>

    <!--img--------->

    <div class="m-img">

    <img alt="" src="images/undraw_online_shopping_ga73.svg" />    

    </div>

<!--text------------>

<div class="m-text">

<h1>Su<font>mm</font>er</h1>

<h2>Collect<font>ion</font></h2>

<!--btn------------>

<a class="m-btn" href="#">Details</a>

</div>

<!--social-------->

<div class="social">

<a href="#"><i class="fab fa-facebook-f"></i></a>

<a href="#"><i class="fab fa-twitter"></i></a>

<a href="#"><i class="fab fa-instagram"></i></a>

<a href="#"><i class="fab fa-youtube"></i></a>

</div>

</section>

<section class="product">

<!--heading------------>

<div class="p-heading">

<h3>Trendy <font>Arri</font>vals</h3>

</div>

<!--product-container----------------->

<div class="product-container">

<!--box-1------------>

<div class="p-box">

<img alt="1" src="images/b1.png" />

<!--details--------->

<p>Black Genuine Leather Bags.</p>

<!--price--->

<a class="price" href="#">$23.3</a>

<!--buy-btn-->

<a class="buy-btn" href="#">Add To Cart</a>

</div>

<!--box-2------------>

<div class="p-box">

<img alt="2" src="images/b2.png" />

<!--details--------->

<p>Black Genuine Leather Bags.</p>

<!--price--->

<a class="price" href="#">$30.3</a>

<!--buy-btn-->

<a class="buy-btn" href="#">Add To Cart</a>

</div>

<!--box-3------------>

<div class="p-box">

<img alt="3" src="images/b3.png" />

<!--details--------->

<p>Black Genuine Leather Bags.</p>

<!--price--->

<a class="price" href="#">$13.3</a>

<!--buy-btn-->

<a class="buy-btn" href="#">Add To Cart</a>

</div>

<!--box-4------------>

<div class="p-box">

<img alt="4" src="images/b4.png" />

<!--details--------->

<p>Black Genuine Leather Bags.</p>

<!--price--->

<a class="price" href="#">$33.3</a>

<!--buy-btn-->

<a class="buy-btn" href="#">Add To Cart</a>

</div>

<!--box-5------------>

<div class="p-box">

<img alt="5" src="images/b5.png" />

<!--details--------->

<p>Black Genuine Leather Bags.</p>

<!--price--->

<a class="price" href="#">$11.3</a>

<!--buy-btn-->

<a class="buy-btn" href="#">Add To Cart</a>

</div>

<!--box-6------------>

<div class="p-box">

<img alt="6" src="images/b6.png" />

<!--details--------->

<p>Black Genuine Leather Bags.</p>

<!--price--->

<a class="price" href="#">$43.3</a>

<!--buy-btn-->

<a class="buy-btn" href="#">Add To Cart</a>

</div>

</div>

</section>

<!--our-brand-section----------------->

<section class="our-brand">

<!--text-->

<div class="brand-text">

<!--heading-->

<h3>Our Brand</h3>

<h4>Small Shoes 2020 New Arrivals Mini Messenger <font>Classic Shoes</font> </h4>

<!--details-->

<p>In porttitor elit ac mi placerat hendrerit. Morbi accumsan, erat in ullamcorper consectetur, nisi erat efficitur eros, sagittis tristique odio turpis vitae dui. Vestibulum gravida est ut erat pretium, non pretium diam feugiat. Integer egestas suscipit lorem ac fermentum. Integer at mauris vitae justo sagittis dapibus. Pellentesque sit amet nisl vitae orci vehicula faucibus. Fusce et lat, feugiat est.</p>

</div>

<!--img-->

<div class="brand-img"><img src="images/mobile.png" /></div>

</section>

<!--watches------------------->

<section class="product">

<!--heading------------>

<div class="p-heading">

<h3>Watch<font>es Show</font>case</h3>

</div>

<!--product-container----------------->

<div class="product-container">

<!--box-1------------>

<div class="p-box">

<img alt="1" src="images/w1.png" />

<!--details--------->

<p>Fashion Silver Chain Watch</p>

<!--price--->

<a class="price" href="#">$23.3</a>

<!--buy-btn-->

<a class="buy-btn" href="#">Add To Cart</a>

</div>

<!--box-2------------>

<div class="p-box">

<img alt="2" src="images/w2.png" />

<!--details--------->

<p>Fashion Genuine Chain Watch</p>

<!--price--->

<a class="price" href="#">$30.3</a>

<!--buy-btn-->

<a class="buy-btn" href="#">Add To Cart</a>

</div>

<!--box-3------------>

<div class="p-box">

<img alt="3" src="images/w3.png" />

<!--details--------->

<p>Fashion Chain Watch.</p>

<!--price--->

<a class="price" href="#">$13.3</a>

<!--buy-btn-->

<a class="buy-btn" href="#">Add To Cart</a>

</div>

<!--box-4------------>

<div class="p-box">

<img alt="4" src="images/w4.png" />

<!--details--------->

<p>Fashion Black Chain Watch</p>

<!--price--->

<a class="price" href="#">$33.3</a>

<!--buy-btn-->

<a class="buy-btn" href="#">Add To Cart</a>

</div>

<!--box-5------------>

<div class="p-box">

<img alt="5" src="images/w5.png" />

<!--details--------->

<p>Fashion Lether  Watch</p>

<!--price--->

<a class="price" href="#">$11.3</a>

<!--buy-btn-->

<a class="buy-btn" href="#">Add To Cart</a>

</div>

<!--box-6------------>

<div class="p-box">

<img alt="6" src="images/w6.png" />

<!--details--------->

<p>Fashion Forign Watch</p>

<!--price--->

<a class="price" href="#">$43.3</a>

<!--buy-btn-->

<a class="buy-btn" href="#">Add To Cart</a>

</div>

</div>

</section>

<!--subscribe------------------------->

<section class="subcribe-container">

<!--heading-->

<h3>Subcribe For New Product Notification</h3>

<!--Input-------->

<div class="subcribe-input">

<input placeholder="Eample@gmail.com" type="email" />

<a class="subcribe-btn" href="#">Send</a>

</div>

</section>

<!--footer--------------------->

<footer>

<h3>LOGO</h3>

<!--footer-menu---------------->

<ul class="footer-menu">

<li><a href="#">Man</a></li>

<li><a href="#">Women</a></li>

<li><a href="#">Kids</a></li>

<li><a href="#">Bags</a></li>

<li><a href="#">Watchs</a></li>

</ul>

</footer>

<!--copyright--------------->

<a class="copyright" href="#">&#169; Copyright 2020. Shop Site By Going To Internet</a>

</body>

</html>


Tidak ada komentar:

Posting Komentar