FineAdmin.Web/Content/lib/datatables/examples/styling/display.html

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

微信扫码关注公众号，代码整理好后第一时间通知你。

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<link rel="shortcut icon" type="image/ico" href="http://www.datatables.net/favicon.ico">
	<meta name="viewport" content="initial-scale=1.0, maximum-scale=2.0">
	<title>DataTables example - Base style</title>
	<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
	<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
	<link rel="stylesheet" type="text/css" href="../resources/demo.css">
	<style type="text/css" class="init">
	
	</style>
	<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
	</script>
	<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
	</script>
	<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
	</script>
	<script type="text/javascript" language="javascript" src="../resources/demo.js">
	</script>
	<script type="text/javascript" language="javascript" class="init">
	
$(document).ready(function() {
	$('#example').DataTable();
} );

	</script>
</head>
<body class="dt-example">
	<div class="container">
		<section>
			<h1>DataTables example <span>Base style</span></h1>
			<div class="info">
				<p>The DataTables default style file has a number of features which can be enabled based on the class name of the table. These features are:</p>
				<ul class="markdown">
					<li><code>cell-border</code> - Cells with a border</li>
					<li><code>compact</code> - Increase the data density by reducing the cell padding</li>
					<li><code>hover</code> - Highlight a row when hovered over</li>
					<li><code>order-column</code> - Highlight the cells in the column currently being ordering upon</li>
					<li><code>row-border</code> - Rows with a border</li>
					<li><code>stripe</code> - Zebra striped rows</li>
				</ul>
				<p>These classes can be combined (simply assign multiple classes to the table) to build up the styling that you want for your table. For more information on the
				options in the DataTables stylesheet, please <a href="//datatables.net/manual/styling/classes">refer to the DataTables styling manual</a></p>
				<p>The <code>display</code> class is a short-cut for specifying the <code>stripe hover order-column row-border</code> as the class name for a table. This is shown
				in the example below.</p>
			</div>
			<div class="demo-html"></div>
			<table id="example" class="display" cellspacing="0" width="100%">
				<thead>
					<tr>
						<th>Name</th>
						<th>Position</th>
						<th>Office</th>
						<th>Age</th>
						<th>Start date</th>
						<th>Salary</th>
					</tr>
				</thead>