Easyui所有图标

拿到自己代码上运行吧

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<!--基本ui-->
		<link rel="stylesheet" type="text/css" href="../themes/default/easyui.css">
		<!--图标-->
		<link rel="stylesheet" type="text/css" href="../themes/icon.css">
		<link rel="stylesheet" type="text/css" href="../demo/demo.css">
		<!-- 引入jQuery -->
		<script type="text/javascript" src="../jquery.min.js"></script>
		<script type="text/javascript" src="../jquery.easyui.min.js"></script>
	</head>

	<body>
		<!--基本表格布局-->
		<table class="easyui-datagrid" title="所有自带icon" data-options="singleSelect:true,collapsible:true" style="width: 500px; height: 1000px;">
			<thead>
				<tr>
					<th data-options="field:'id' , width:150">id</th>
					<th data-options="field:'iconCls' , width:150">iconCls</th>
					<th data-options="field:'xx' , width:200">图片</th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">01</th>
					<th data-options="field:'id' , width:150">icon-back</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/back.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">02</th>
					<th data-options="field:'id' , width:150">icon-blank</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/blank.gif" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">03</th>
					<th data-options="field:'id' , width:150">icon-cancel</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/cancel.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">04</th>
					<th data-options="field:'id' , width:150">icon-back</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/back.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">05</th>
					<th data-options="field:'id' , width:150">icon-clear</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/clear.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">06</th>
					<th data-options="field:'id' , width:150">icon-cut</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/cut.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">07</th>
					<th data-options="field:'id' , width:150">icon-edit_add</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/edit_add.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">08</th>
					<th data-options="field:'id' , width:150">icon-edit_remove</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/edit_remove.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">09</th>
					<th data-options="field:'id' , width:150">icon-filesave</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/filesave.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">10</th>
					<th data-options="field:'id' , width:150">icon-filter</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/filter.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">11</th>
					<th data-options="field:'id' , width:150">icon-help</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/help.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">12</th>
					<th data-options="field:'id' , width:150">icon-large_chart</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/large_chart.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">13</th>
					<th data-options="field:'id' , width:150">icon-large_clipart</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/large_clipart.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">14</th>
					<th data-options="field:'id' , width:150">icon-large_picture</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/large_picture.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">15</th>
					<th data-options="field:'id' , width:150">icon-large_shapes</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/large_shapes.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">16</th>
					<th data-options="field:'id' , width:150">icon-large_smartart</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/large_smartart.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">17</th>
					<th data-options="field:'id' , width:150">icon-lock</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/lock.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">18</th>
					<th data-options="field:'id' , width:150">icon-man</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/man.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">19</th>
					<th data-options="field:'id' , width:150">icon-mini_add</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/mini_add.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">20</th>
					<th data-options="field:'id' , width:150">icon-mini_edit</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/mini_edit.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">21</th>
					<th data-options="field:'id' , width:150">icon-mini_refresh</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/mini_refresh.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">22</th>
					<th data-options="field:'id' , width:150">icon-more</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/more.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">23</th>
					<th data-options="field:'id' , width:150">icon-no</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/no.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">24</th>
					<th data-options="field:'id' , width:150">icon-ok</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/ok.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">25</th>
					<th data-options="field:'id' , width:150">icon-pencil</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/pencil.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">26</th>
					<th data-options="field:'id' , width:150">icon-print</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/print.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">27</th>
					<th data-options="field:'id' , width:150">icon-redo</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/redo.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">28</th>
					<th data-options="field:'id' , width:150">icon-reload</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/reload.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">29</th>
					<th data-options="field:'id' , width:150">icon-search</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/search.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">30</th>
					<th data-options="field:'id' , width:150">icon-sum</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/sum.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">31</th>
					<th data-options="field:'id' , width:150">icon-tip</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/tip.png" /></th>
				</tr>
				<tr>
					<th data-options="field:'id' , width:150">32</th>
					<th data-options="field:'id' , width:150">icon-undo</th>
					<th data-options="field:'id' , width:200"><img src="../themes/icons/undo.png" /></th>
				</tr>
			</thead>
		</table>
	</body>

</html>

  

 

posted @ 2017-04-11 16:22  我辈年轻  阅读(1113)  评论(0)    收藏  举报