Files
giao_dien_web_mau/demo-thoitrang-2/product-detail.html

280 lines
14 KiB
HTML
Raw Normal View History

2023-04-13 10:48:43 +07:00
<!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">
<title>Document</title>
<link rel="stylesheet" href="./assets/css/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css" />
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.default.min.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.css" />
</head>
<body>
<div class="product-detail">
<div class="global-breadcrumb">
<div class="container">
<div id="breadcrumb" class="breadcrumb">
<ol itemscope="" itemtype="http://schema.org/BreadcrumbList">
<li itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem" class="home">
<a href="/" itemprop="item" class="nopad-l">
<span itemprop="name">Trang chủ</span>
<i>/</i>
</a>
<meta itemprop="position" content="1">
</li>
<li itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem">
<a href="/linh-kien-may-tinh/" itemprop="item">
<span itemprop="name">
Linh Kiện Máy Tính
</span> <span class="last-bre"> </span>
</a>
<meta itemprop="position" content="2">
</li>
</ol>
<div class="name">Beige Midi Woven Dress</div>
</div>
<div class="clearfix"></div>
</div>
</div>
<div class="container">
<div class="main-product-detail d-flex">
<div class="product-image-detail">
<div id="sync1" class="owl-theme owl-carousel custom-nav owl-loaded owl-drag">
<a class="item" href="./assets/images/image-big-detail-1.png" data-fancybox="gallery">
<img src="./assets/images/image-big-detail-1.png" alt="">
</a>
<a class="item">
<img src="./assets/images/image-big-detail-2.png" alt="">
</a>
<a class="item">
<img src="./assets/images/image-big-detail-3.jpg" alt="">
</a>
<a class="item">
<img src="./assets/images/image-big-detail-4.jpg" alt="">
</a>
<a class="item">
<img src="./assets/images/image-big-detail-5.jpg" alt="">
</a>
<a class="item">
<img src="./assets/images/image-big-detail-6.jpg" alt="">
</a>
</div>
<div id="sync2" class="owl-theme owl-carousel custom-nav owl-loaded owl-drag">
<a href="./assets/images/image-big-detail-1.png" class="item">
<img src="./assets/images/image-small-detail-1.png" alt="">
</a>
<a href="./assets/images/image-big-detail-2.png" class="item">
<img src="./assets/images/image-small-detail-2.png" alt="">
</a>
<a href="./assets/images/image-big-detail-3.jpg" class="item">
<img src="./assets/images/image-small-detail-3.png" alt="">
</a>
</div>
</div>
<div class="product-info-detail">
<h1 class="name">Beige Midi Woven Dress</h1>
<div class="d-flex align-items">
<div class="sku">MSP: 68220804001DI0210</div>
<div class="total-review d-flex align-items">
<i class="icon_star star5"></i>
<span>(1)</span>
</div>
</div>
<div class="main-price d-flex align-items">
<b class="price">1.148.000đ</b>
<del class="old-price">2.296.000đ</del>
</div>
<a href="javascript:void()" class="click-size">
<i class="icon_2023 size"></i>
<span>Hướng dẫn kích thước</span>
</a>
<div class="product-btn-cart">
<div class="btn-buy">
<a href="javascript:void(0)" class="buy-go-cart btn-buyNow js-buyNow" data-id="7882"
data-name="">
Mua ngay
</a>
</div>
<div class="btn-buy showrrom">
<a href="javascript:void(0)" class="showrrom">
<i class="icon_2023 map"></i>
<span>TÌM SẢN PHẨM TẠI SHOWROOM</span>
</a>
</div>
</div>
<div class="note-detail">
<div>
<p>MIỄN PHÍ GIAO HÀNG TOÀN QUỐC</p>
<span>(Cho hóa đơn từ 300.000đ)</span>
</div>
<div>
<p>ĐỔI TRẢ DỄ DÀNG</p>
<span>(Đổi trả trong 7 ngày với lỗi do nhà sản xuất)</span>
</div>
<div>
<p>TỔNG ĐÀI BÁN HÀNG 1800 1162</p>
<span>(Miễn phí từ 8h00 - 21:00 mỗi ngày)</span>
</div>
</div>
</div>
</div>
<div class="content-product-detail">
<div class="list-tab d-flex align-items" id="title_tab_scroll_pro">
<a href="#tabdesc" class="item-tab active">chi tiết sản phẩm</a>
<a href="#tabinfo" class="item-tab">HƯỚNG DẪN BẢO QUẢN</a>
<a href="#tabreview" class="item-tab">REVIEW</a>
</div>
<div class="content-tab nd active" id="tabdesc">
<p>- Áo sọc sát nách cổ lọ thiết kế tối giản, trẻ trung</p>
<p>- Trang phục phù hợp dạo phố, đi chơi, đi học....</p>
<p>- Kích thước áo: S - M - L</p>
<p>- Chiều dài: </p>
<p>S: 51 cm - M: 52 cm - L: 53 cm</p>
<p><strong>Hướng dẫn sử dụng</strong><br /> - Giặt tay bằng nước lạnh</p>
<p>- Không ngâm, không tẩy </p>
<p>- Giặt riêng các sản phẩm khác màu</p>
<p>- Không vắt</p>
<p>- Là ủi ở nhiệt độ thấp.</p>
<p>- Khuyến kích giặt khô</p>
</div>
</div>
<div class="product-related">
<div class="title">Sản phẩm liên quan</div>
<div class="box-related d-flex">
<div class="left">
<img src="./assets/images/image-big-detail-1.png" alt="product" class="image-product-related">
</div>
<div class="right">
<div class="product-list d-flex">
<div class="product-item">
<a href="" class="image-product">
<img src="./assets/images/product-deal.png" alt="">
</a>
<div class="box-sale saleoff">- 17%</div>
<a href="" class="product-title">
Cream Cropped Woven Vest (Áo vest)
</a>
<div class="info-product d-flex align-items">
<div class="product-price-main d-flex align-items">
<b class="price">
37.490.000 đ
</b>
<del class="old-price">38.490.000 đ</del>
</div>
<a href="javascript" class="buy-cart">
<i class="icon_2023 cart"></i>
</a>
</div>
</div>
<div class="product-item">
<a href="" class="image-product">
<img src="./assets/images/product-deal.png" alt="">
</a>
<div class="box-sale saleoff">- 17%</div>
<a href="" class="product-title">
Cream Cropped Woven Vest (Áo vest)
</a>
<div class="info-product d-flex align-items">
<div class="product-price-main d-flex align-items">
<b class="price">
37.490.000 đ
</b>
<del class="old-price">38.490.000 đ</del>
</div>
<a href="javascript" class="buy-cart">
<i class="icon_2023 cart"></i>
</a>
</div>
</div>
<div class="product-item">
<a href="" class="image-product">
<img src="./assets/images/product-deal.png" alt="">
</a>
<div class="box-sale saleoff">- 17%</div>
<a href="" class="product-title">
Cream Cropped Woven Vest (Áo vest)
</a>
<div class="info-product d-flex align-items">
<div class="product-price-main d-flex align-items">
<b class="price">
37.490.000 đ
</b>
<del class="old-price">38.490.000 đ</del>
</div>
<a href="javascript" class="buy-cart">
<i class="icon_2023 cart"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="box-list-size">
<div class="title text-center">Hướng dẫn chọn kích thước</div>
<a href="javascript:void()" class="click-close">
<i class="fa fa-times"></i>
</a>
<table border="1">
<tr>
<td><b>Thông số/ Cỡ</b></td>
<td><b>S (27)</b></td>
<td><b>M (28)</b></td>
<td><b>L (29)</b></td>
<td><b>XL (30)</b></td>
<td><b>XXL (31)</b></td>
</tr>
<tr>
<td><b>Chiều cao (cm)</b></td>
<td>150 - 155</td>
<td>155 - 163</td>
<td>160 - 165</td>
<td>162 - 166</td>
<td>163 - 168</td>
</tr>
<tr>
<td><b>Cân nặng (kg)</b></td>
<td>41 - 46</td>
<td>47 - 52</td>
<td>53 - 58</td>
<td>59 - 64</td>
<td>65 - 69</td>
</tr>
<tr>
<td><b>Vòng ngực (cm)</b></td>
<td>79 - 82</td>
<td>82 - 87</td>
<td>88 - 94</td>
<td>94 - 99</td>
<td>99 - 104</td>
</tr>
<tr>
<td><b>Rộng mông (cm)</b></td>
<td>88 - 90</td>
<td>90 - 94</td>
<td>94 - 98</td>
<td>98 - 102</td>
<td>102 - 107</td>
</tr>
</table>
</div>
</div>
</body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.js"></script>
<script src="./assets/js/main.js"></script>
</html>