중앙 페이지 매김
중앙 페이지 매김
페이지 매김을 중앙에 배치하려면 <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에서 해주시기 바랍니다.
| 번호 | 분류 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|---|
| 1007 | CSS | 8년 전 | 1832 | ||
| 1006 | CSS | 8년 전 | 2539 | ||
| 1005 | CSS | 8년 전 | 1994 | ||
| 1004 | HTML | 8년 전 | 2415 | ||
| 1003 | HTML | 8년 전 | 2849 | ||
| 1002 | HTML | 8년 전 | 3224 | ||
| 1001 | HTML | 8년 전 | 3692 | ||
| 1000 | HTML | 8년 전 | 2164 | ||
| 999 | HTML | 8년 전 | 2394 | ||
| 998 | HTML | 8년 전 | 2323 | ||
| 997 | HTML | 8년 전 | 1943 | ||
| 996 | HTML | 8년 전 | 2219 | ||
| 995 | 기타 | 8년 전 | 2085 | ||
| 994 | 기타 | 8년 전 | 2364 | ||
| 993 | 기타 | 8년 전 | 3229 | ||
| 992 | 반응형 | 8년 전 | 2754 | ||
| 991 | 반응형 | 8년 전 | 1977 | ||
| 990 | 반응형 | 8년 전 | 1947 | ||
| 989 | 반응형 | 8년 전 | 2251 | ||
| 988 | 반응형 | 8년 전 | 2412 | ||
| 987 | 반응형 | 8년 전 | 2506 | ||
| 986 | CSS | 8년 전 | 2647 | ||
| 985 | CSS | 8년 전 | 2708 | ||
| 984 | CSS | 8년 전 | 2673 | ||
| 983 | CSS | 8년 전 | 2357 | ||
| 982 | CSS | 8년 전 | 2020 | ||
| 981 | CSS | 8년 전 | 2143 | ||
| 980 | CSS | 8년 전 | 3633 | ||
| 979 | CSS | 8년 전 | 2926 | ||
| 978 | CSS | 8년 전 | 2162 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기