테이블을 간단하게 멋지게 ( datatables - Table Plug-in for jQuery )
☞ 테이블을 간단하게 멋지게 ( datatables - Table Plug-in for jQuery )
http://datatables.net
01. 두 개의 파일을 html 페이지 <head></head> 부분에 삽입
CSS : //cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css
JS : //cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js
ex) CDN
<link rel="stylesheet" href="//cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css ">
<script src="//cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
Server 설치시
<link rel="stylesheet" type="text/css" href="DataTables/datatables.min.css"/>
<script type="text/javascript" src="DataTables/datatables.min.js"></script>
다운로드 :
02. 아래의 function을 호출 - body에 삽입
$(document).ready( function () { $('#myTable').DataTable();} );ex) <script type="text/javascript">
$(document).ready( function () {
$('#myTable').DataTable(); } );</script>
#myTable - 꾸밀 테이블 id
Styling - table
'Web Design > web design general' 카테고리의 다른 글
| Code Editors - 코딩을 위한 멋진 에디터 프로그램 (2) | 2018.04.18 |
|---|---|
| 웹폰트 (web font) 사용하기 (1) - CDN (0) | 2018.04.16 |
| SVG 관련 유용한 사이트 (0) | 2018.04.10 |
| APNG (Animated Portable Network Graphics) & PNG (0) | 2017.07.16 |
| 반응형 웹디자인 (Responsive web design )을 위한 Grid system (0) | 2015.06.24 |
