중앙 페이지 매김

· 8년 전 · 2125

중앙 페이지 매김


67df4843d6389d9795a88ee2b5f34a58_1505372961_9992.PNG
 


페이지 매김을 중앙에 배치하려면 <div>와 같은 컨테이너 요소를 text-align:center


.center {

    text-align: center;

}


<!DOCTYPE html>

<html>

<head>

<style>

.center {

    text-align: center;

}


.pagination {

    display: inline-block;

}


.pagination a {

    color: black;

    float: left;

    padding: 8px 16px;

    text-decoration: none;

    transition: background-color .3s;

    border: 1px solid #ddd;

    margin: 0 4px;

}


.pagination a.active {

    background-color: #4CAF50;

    color: white;

    border: 1px solid #4CAF50;

}


.pagination a:hover:not(.active) {background-color: #ddd;}

</style>

</head>

<body>


<h2>Centered Pagination</h2>


<div class="center">

  <div class="pagination">

    <a href="#">«</a>

    <a href="#">1</a>

    <a href="#" class="active">2</a>

    <a href="#">3</a>

    <a href="#">4</a>

    <a href="#">5</a>

    <a href="#">6</a>

    <a href="#">»</a>

  </div>

</div>


</body>

</html>


|
댓글을 작성하시려면 로그인이 필요합니다.

퍼블리셔팁

퍼블리싱과 관련된 유용한 정보를 공유하세요. 질문은 상단의 QA에서 해주시기 바랍니다.

+
분류 제목 글쓴이 날짜 조회
CSS 8년 전 조회 1,647
CSS 8년 전 조회 1,983
CSS 8년 전 조회 2,131
CSS 8년 전 조회 2,090
HTML 8년 전 조회 4,564
CSS 8년 전 조회 1,647
CSS 8년 전 조회 1,769
CSS 8년 전 조회 1,640
CSS 8년 전 조회 1,690
CSS 8년 전 조회 1,361
CSS 8년 전 조회 1,213
CSS 8년 전 조회 2,302
CSS 8년 전 조회 2,105
CSS 8년 전 조회 2,079
CSS 8년 전 조회 2,126
CSS 8년 전 조회 1,799
CSS 8년 전 조회 1,867
CSS 8년 전 조회 2,167
CSS 8년 전 조회 2,048
CSS 8년 전 조회 1,869
CSS 8년 전 조회 1,714
CSS 8년 전 조회 1,763
CSS 8년 전 조회 2,193
CSS 8년 전 조회 1,760
CSS 8년 전 조회 2,007
CSS 8년 전 조회 1,809
CSS 8년 전 조회 1,681
CSS 8년 전 조회 2,025
CSS 8년 전 조회 1,616
CSS 8년 전 조회 1,731