<html><head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
</head>
<body>
<div class="container">
<div id="global-search" class="row fixed-top bg-white">
<div class="col">
<img class="img-fluid" src="./img/gnb-logo.png">
</div>
<div class="col-8 rounded-pill bg-secondary">
<div class="row">
<div class="col-10">
<input class="border bg-secondary border-0 form-control form-control-sm" type="text">
</div>
<div class="col">
<i class="text-danger bi bi-search"></i>
</div>
</div>
</div>
<div class="col">
<i class="bi bi-cart"></i>
</div>
</div>
<div id="global-navi" class="row mt-5">
<div class="col overflow-x-auto">
<div class="row" style="width: 200%;">
<div class="col">메뉴1</div>
<div class="col">메뉴2</div>
<div class="col">메뉴3</div>
<div class="col">메뉴4</div>
<div class="col">메뉴5</div>
<div class="col">메뉴6</div>
<div class="col">메뉴7</div>
<div class="col">메뉴8</div>
<div class="col">메뉴9</div>
</div>
</div>
</div>
<div id="ad-c" class="row">
<div id="carouselExampleIndicators" class="carousel slide">
<div class="carousel-indicators">
<button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
<button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="1" aria-label="Slide 2"></button>
<button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="2" aria-label="Slide 3"></button>
</div>
<div class="carousel-inner">
<div class="carousel-item active">
<img src="./img/2310041627543300146_320.jpg" class="d-block w-100" alt="...">
</div>
<div class="carousel-item">
<img src="./img/a0f4c2247880a7a02d5da5fefb2329f2.jpg" class="d-block w-100" alt="...">
</div>
<div class="carousel-item">
<img src="./img/2310041627543300146_320.jpg" class="d-block w-100" alt="...">
</div>
</div>
<button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-next" type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
</div>
</div>
<div id="etc" class="row">
<div class="col">... 기타 등등</div>
</div>
<div id="item-header" class="row">
<div class="col fw-bold">상품 리스트</div>
</div>
<div id="item-list" class="row row-cols-1">
<div class="col">
<div class="row">
<div class="col">
<img class="img-fluid" src="./img/D.jpg">
</div>
</div>
</div>
<div class="row">
<div class="border border-success col-4 text-center text-success">즉시할인중</div>
</div>
<div class="row">
<div class="col">LF패션 핏플랍 편안한 컴포트 슈즈 모음</div>
</div>
<div class="row">
<div class="col">
<span>쇼킹딜가</span>
<span>99,999</span>
<span>원~</span>
</div>
</div>
<div class="row">
<div class="col">
<span>
<i class="bi bi-star-fill"></i>
<i class="bi bi-star-fill"></i>
<i class="bi bi-star-fill"></i>
<i class="bi bi-star-fill"></i>
<i class="bi bi-star"></i>
</span>
<span>468</span>
</div>
</div>
<div class="row"></div>
</div> <div class="col">
<div class="row">
<div class="col">
<img class="img-fluid" src="./img/D.jpg">
</div>
</div>
<div class="row">
<div class="border border-success col-4 text-center text-success">즉시할인중</div>
</div>
<div class="row">
<div class="col">LF패션 핏플랍 편안한 컴포트 슈즈 모음</div>
</div>
<div class="row">
<div class="col">
<span>쇼킹딜가</span>
<span>99,999</span>
<span>원~</span>
</div>
</div>
<div class="row">
<div class="col">
<span>
<i class="bi bi-star-fill"></i>
<i class="bi bi-star-fill"></i>
<i class="bi bi-star-fill"></i>
<i class="bi bi-star-fill"></i>
<i class="bi bi-star"></i>
</span>
<span>468</span>
</div>
</div>
<div class="row"></div>
</div> <div class="col">
<div class="row">
<div class="col">
<img class="img-fluid" src="./img/D.jpg">
</div>
</div>
<div class="row">
<div class="border border-success col-4 text-center text-success">즉시할인중</div>
</div>
<div class="row">
<div class="col">LF패션 핏플랍 편안한 컴포트 슈즈 모음</div>
</div>
<div class="row">
<div class="col">
<span>쇼킹딜가</span>
<span>99,999</span>
<span>원~</span>
</div>
</div>
<div class="row">
<div class="col">
<span>
<i class="bi bi-star-fill"></i>
<i class="bi bi-star-fill"></i>
<i class="bi bi-star-fill"></i>
<i class="bi bi-star-fill"></i>
<i class="bi bi-star"></i>
</span>
<span>468</span>
</div>
</div>
<div class="row"></div>
</div>
<div class="col">아이템1</div>
<div class="col">아이템1</div>
<div class="col">아이템1</div>
</div>
<div class="row fixed-bottom bg-white">
<div class="col">아이콘1</div>
<div class="col">아이콘1</div>
<div class="col">아이콘1</div>
<div class="col">아이콘1</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
<!-- Code injected by live-server -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"
integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL"
crossorigin="anonymous"></script>
</body></html>
'HTML > DAY 31 _ 23.10.06' 카테고리의 다른 글
Wep page Self1 - 대영 (1) | 2023.10.11 |
---|---|
모바일용 (0) | 2023.10.11 |