分類
<!--核心樣式-->
<link rel="stylesheet" type="text/css" href="css/jquery.gridster.min.css">
<style>
/*網格圖片調用*/
.s1{background: url('img/140x140.png');}
.s2{background: url('img/300x140.png');}
.s3{background: url('img//140x300.png');}
.s4{background: url('img//300x300.png');}
</style>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.gridster.min.js"></script>
<script>
$(function() {
$(".gridster ul").gridster({
widget_margins: [10, 10],
widget_base_dimensions: [140, 140]
});
});
</script>
<!--主要代碼--> <section> <div class="gridster"> <ul> <li class="s1" data-row="1" data-col="1" data-sizex="1" data-sizey="1"></li> <li class="s1" data-row="2" data-col="1" data-sizex="1" data-sizey="1"></li> <li class="s1" data-row="3" data-col="1" data-sizex="1" data-sizey="1"></li> <li class="s2" data-row="1" data-col="2" data-sizex="2" data-sizey="1"></li> <li class="s4" data-row="2" data-col="2" data-sizex="2" data-sizey="2"></li> <li class="s1" data-row="1" data-col="4" data-sizex="1" data-sizey="1"></li> <li class="s2" data-row="2" data-col="4" data-sizex="2" data-sizey="1"></li> <li class="s1" data-row="3" data-col="4" data-sizex="1" data-sizey="1"></li> <li class="s1" data-row="1" data-col="5" data-sizex="1" data-sizey="1"></li> <li class="s1" data-row="3" data-col="5" data-sizex="1" data-sizey="1"></li> <li class="s1" data-row="1" data-col="6" data-sizex="1" data-sizey="1"></li> <li class="s3" data-row="2" data-col="6" data-sizex="1" data-sizey="2"></li> </ul> </div> </section>
1. 本站所有素材（未指定商用），僅限學習交流。
2. 會員在本站下載的原創商用和VIP素材后，只擁有使用權，著作權歸原作者及17素材網所有。
3. 原創商用和VIP素材，未經合法授權，請勿用于商業用途，會員不得以任何形式發布、傳播、復制、轉售該素材，否則一律封號處理。
4. 本平臺織夢模板僅展示和個人非盈利用途，織夢系統商業用途請預先授權。
