<![CDATA[
<div class="figure-img" data-ke-type="image" data-ke-style="alignCenter" data-ke-mobilestyle="widthOrigin"><img src="https://t1.daumcdn.net/cafeattach/1PqNJ/1702a85f7fd4faa1c717ed002153275c24afba2f" class="txc-image" data-img-src="https://t1.daumcdn.net/cafeattach/1PqNJ/1702a85f7fd4faa1c717ed002153275c24afba2f" data-origin-width="1439" data-origin-height="802"></div><div class="figure-img" data-ke-type="image" data-ke-style="alignCenter" data-ke-mobilestyle="widthOrigin"><img src="https://t1.daumcdn.net/cafeattach/1PqNJ/66d1c2bc513c20b989c4908d2f903b2d9ad3ee31" class="txc-image" data-img-src="https://t1.daumcdn.net/cafeattach/1PqNJ/66d1c2bc513c20b989c4908d2f903b2d9ad3ee31" data-origin-width="1438" data-origin-height="692"></div><div class="figure-img" data-ke-type="image" data-ke-style="alignCenter" data-ke-mobilestyle="widthOrigin"><img src="https://t1.daumcdn.net/cafeattach/1PqNJ/47c10c2991e09fed8346a7ee881c02d3abb36fbb" class="txc-image" data-img-src="https://t1.daumcdn.net/cafeattach/1PqNJ/47c10c2991e09fed8346a7ee881c02d3abb36fbb" data-origin-width="1438" data-origin-height="223"></div><p><span style="color: #333333;" data-ke-size="size18"><!DOCTYPE html></span></p><p><span style="color: #333333;" data-ke-size="size18"><html lang="en"></span></p><p> </p><p><span style="color: #333333;" data-ke-size="size18"><head></span></p><p><span style="color: #333333;" data-ke-size="size18">    <meta charset="UTF-8" /></span></p><p><span style="color: #333333;" data-ke-size="size18">    <meta http-equiv="X-UA-Compatible" content="IE=edge" /></span></p><p><span style="color: #333333;" data-ke-size="size18">    <meta name="viewport" content="width=device-width, initial-scale=1.0" /></span></p><p><span style="color: #333333;" data-ke-size="size18">    <link rel="stylesheet" href="./assets/css/bootstrap.min.css" /></span></p><p><span style="color: #333333;" data-ke-size="size18">    <title>Bootstrap Sandbox | List Groups & Badges</title></span></p><p><span style="color: #333333;" data-ke-size="size18"></head></span></p><p> </p><p><span style="color: #333333;" data-ke-size="size18"><body></span></p><p><span style="color: #333333;" data-ke-size="size18">    <div class="container"></span></p><p><span style="color: #333333;" data-ke-size="size18">        <h1 class="mb-5">List Groups & Badges</h1></span></p><p> </p><p><span style="color: #333333;" data-ke-size="size18">        <!-- Simple List Group --></span></p><p><span style="color: #333333;" data-ke-size="size18">        <ul class="list-group"></span></p><p><span style="color: #333333;" data-ke-size="size18">            <li class="list-group-item">Tony Stark</li></span></p><p><span style="color: #333333;" data-ke-size="size18">            <li class="list-group-item">Steve Rogers</li></span></p><p><span style="color: #333333;" data-ke-size="size18">            <li class="list-group-item active">Bruce Banner</li></span></p><p><span style="color: #333333;" data-ke-size="size18">            <li class="list-group-item">Thor Odinson</li></span></p><p><span style="color: #333333;" data-ke-size="size18">            <li class="list-group-item disabled">Rick Jones</li></span></p><p><span style="color: #333333;" data-ke-size="size18">        </ul></span></p><p> </p><p><span style="color: #333333;" data-ke-size="size18">        <br /><br /></span></p><p> </p><p><span style="color: #333333;" data-ke-size="size18">        <!-- Links --></span></p><p><span style="color: #333333;" data-ke-size="size18">        <div class="list-group"></span></p><p><span style="color: #333333;" data-ke-size="size18">            <a class="list-group-item" href="#">Tony Stark</a></span></p><p><span style="color: #333333;" data-ke-size="size18">            <a class="list-group-item" href="#">Steve Rogers</a></span></p><p><span style="color: #333333;" data-ke-size="size18">            <a class="list-group-item active" href="#">Bruce Banner</a></span></p><p><span style="color: #333333;" data-ke-size="size18">            <a class="list-group-item" href="#">Thor Odinson</a></span></p><p><span style="color: #333333;" data-ke-size="size18">            <a class="list-group-item disabled" href="#">Rick Jones</a></span></p><p><span style="color: #333333;" data-ke-size="size18">        </div></span></p><p><span style="color: #333333;" data-ke-size="size18">        <br /><br /></span></p><p> </p><p><span style="color: #333333;" data-ke-size="size18">        <!-- Flush Style --></span></p><p><span style="color: #333333;" data-ke-size="size18">        <ul class="list-group list-group-flush"></span></p><p><span style="color: #333333;" data-ke-size="size18">            <li class="list-group-item">Tony Stark</li></span></p><p><span style="color: #333333;" data-ke-size="size18">            <li class="list-group-item">Steve Rogers</li></span></p><p><span style="color: #333333;" data-ke-size="size18">            <li class="list-group-item active">Bruce Banner</li></span></p><p><span style="color: #333333;" data-ke-size="size18">            <li class="list-group-item">Thor Odinson</li></span></p><p><span style="color: #333333;" data-ke-size="size18">            <li class="list-group-item disabled">Rick Jones</li></span></p><p><span style="color: #333333;" data-ke-size="size18">        </ul></span></p><p><span style="color: #333333;" data-ke-size="size18">        <br /><br /></span></p><p> </p><p><span style="color: #333333;" data-ke-size="size18">        <!-- Numbered List --></span></p><p><span style="color: #333333;" data-ke-size="size18">        <ol class="list-group list-group-numbered"></span></p><p><span style="color: #333333;" data-ke-size="size18">            <li class="list-group-item">Tony Stark</li></span></p><p><span style="color: #333333;" data-ke-size="size18">            <li class="list-group-item">Steve Rogers</li></span></p><p><span style="color: #333333;" data-ke-size="size18">            <li class="list-group-item active">Bruce Banner</li></span></p><p><span style="color: #333333;" data-ke-size="size18">            <li class="list-group-item">Thor Odinson</li></span></p><p><span style="color: #333333;" data-ke-size="size18">            <li class="list-group-item disabled">Rick Jones</li></span></p><p><span style="color: #333333;" data-ke-size="size18">        </ol></span></p><p><span style="color: #333333;" data-ke-size="size18">        <br /><br /></span></p><p> </p><p><span style="color: #333333;" data-ke-size="size18">        <!-- Badges --></span></p><p><span style="color: #333333;" data-ke-size="size18">        <h1>Example heading <span class="badge bg-primary">New</span></h1></span></p><p><span style="color: #333333;" data-ke-size="size18">        <h2>Example heading <span class="badge bg-secondary">New</span></h2></span></p><p><span style="color: #333333;" data-ke-size="size18">        <h3>Example heading <span class="badge bg-success">New</span></h3></span></p><p><span style="color: #333333;" data-ke-size="size18">        <h4>Example heading <span class="badge bg-danger">New</span></h4></span></p><p><span style="color: #333333;" data-ke-size="size18">        <h5>Example heading <span class="badge bg-warning">New</span></h5></span></p><p><span style="color: #333333;" data-ke-size="size18">        <h6>Example heading <span class="badge bg-info">New</span></h6></span></p><p> </p><p><span style="color: #333333;" data-ke-size="size18">        <br /><br /></span></p><p> </p><p><span style="color: #333333;" data-ke-size="size18">        <!-- In Button --></span></p><p><span style="color: #333333;" data-ke-size="size18">        <button type="button" class="btn btn-primary"></span></p><p><span style="color: #333333;" data-ke-size="size18">            Notifications <span class="badge text-bg-dark">New</span></span></p><p><span style="color: #333333;" data-ke-size="size18">        </button></span></p><p><span style="color: #333333;" data-ke-size="size18">        <br /><br /></span></p><p> </p><p><span style="color: #333333;" data-ke-size="size18">        <!-- Badges in List Group --></span></p><p><span style="color: #333333;" data-ke-size="size18">        <ul class="list-group"></span></p><p><span style="color: #333333;" data-ke-size="size18">            <li class="list-group-item d-flex justify-content-between align-items-start"></span></p><p><span style="color: #333333;" data-ke-size="size18">                <div class="ms-2 me-auto"></span></p><p><span style="color: #333333;" data-ke-size="size18">                    <div class="fw-bold">Electronics</div></span></p><p><span style="color: #333333;" data-ke-size="size18">                    Content for this item</span></p><p><span style="color: #333333;" data-ke-size="size18">                </div></span></p><p><span style="color: #333333;" data-ke-size="size18">                <span class="badge bg-primary rounded-pill">20</span></span></p><p><span style="color: #333333;" data-ke-size="size18">            </li></span></p><p><span style="color: #333333;" data-ke-size="size18">            <li class="list-group-item d-flex justify-content-between align-items-start"></span></p><p><span style="color: #333333;" data-ke-size="size18">                <div class="ms-2 me-auto"></span></p><p><span style="color: #333333;" data-ke-size="size18">                    <div class="fw-bold">Fashion</div></span></p><p><span style="color: #333333;" data-ke-size="size18">                    Content for this item</span></p><p><span style="color: #333333;" data-ke-size="size18">                </div></span></p><p><span style="color: #333333;" data-ke-size="size18">                <span class="badge bg-danger rounded-pill">10</span></span></p><p><span style="color: #333333;" data-ke-size="size18">            </li></span></p><p><span style="color: #333333;" data-ke-size="size18">            <li class="list-group-item d-flex justify-content-between align-items-start"></span></p><p><span style="color: #333333;" data-ke-size="size18">                <div class="ms-2 me-auto"></span></p><p><span style="color: #333333;" data-ke-size="size18">                    <div class="fw-bold">Sports</div></span></p><p><span style="color: #333333;" data-ke-size="size18">                    Content for this item</span></p><p><span style="color: #333333;" data-ke-size="size18">                </div></span></p><p><span style="color: #333333;" data-ke-size="size18">                <span class="badge bg-success rounded-pill">30</span></span></p><p><span style="color: #333333;" data-ke-size="size18">            </li></span></p><p><span style="color: #333333;" data-ke-size="size18">        </ul></span></p><p><span style="color: #333333;" data-ke-size="size18">        <!-- Don't go past here --></span></p><p><span style="color: #333333;" data-ke-size="size18">    </div></span></p><p><span style="color: #333333;" data-ke-size="size18">    <div style="margin-top: 350px"></div></span></p><p> </p><p><span style="color: #333333;" data-ke-size="size18">    <script src="./assets/js/bootstrap.bundle.min.js"></script></span></p><p><span style="color: #333333;" data-ke-size="size18"></body></span></p><p> </p><p><span style="color: #333333;" data-ke-size="size18"></html></span></p>
<!-- -->
]]>
카페 게시글
CSS
bootstrap
List Groups과 Badges
주인장
추천 0
조회 3
24.12.20 17:09
댓글 0
다음검색
