테스트 사이트 - 개발 중인 베타 버전입니다

Bootstrap Pager 버튼 맞춤

· 7년 전 · 3203 · 1
스크린샷 2017-11-21 오후 9.49.02.png
Bootstrap Pager 버튼 맞춤

.previousand를 사용하여 .next각 버튼을 페이지의 측면에 정렬합니다.


<ul class="pager">
<li class="previous"><a href="#">Previous</a></li>
<li class="next"><a href="#">Next</a></li>
</ul>


[전체소스]
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>

<div class="container">
<h2>Pager</h2>
<p>The .previous and .next classes align each link to the sides of the page:</p>
<ul class="pager">
<li class="previous"><a href="#">Previous</a></li>
<li class="next"><a href="#">Next</a></li>
</ul>
</div>

</body>
</html>

댓글 작성

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

로그인하기

댓글 1개

2년 전

와 이렇게 정리해주시니 좋네요 ㅎㅎ 한 10년 지나 다시 홈페이지 코딩을 해보려는데 이것저것 막히는 부분이 많네요 

게시글 목록

번호 제목
1326
1325
1324
1323
1322
1321
1320
1319
1318
1317
1316
1315
1314
1313
1312
1311
1310
1309
1308
1307
1306
1305
1304
1303
jQuery Mobile pageshow 이벤트
1302
1301
1300
jQuery Mobile pageload 이벤트
1299
jQuery Mobile pageinit 이벤트
1298
jQuery Mobile pagehide 이벤트
1297
jQuery Mobile pagecreate