标签:技术分享 family tabs ryu second 插入 size cat html
首先百度jQuery扩展包,下载之后将里面的js,css文件全都引入到页面中就可以使用了。
<script src = "jqueryui/external/jquery/jquery.js"></script> <script src="jqueryui/js/jquery-ui.js"></script> <script src="jqueryui/js/jquery-ui.min.js"></script> <link rel=stylesheet type="text/css" href="jqueryui/jquery-ui.css"/> <link rel=stylesheet type="text/css" href="jqueryui/jquery-ui.min.css"/> <link rel=stylesheet type="text/css" href="jqueryui/jquery-ui.structure.css"/> <link rel=stylesheet type="text/css" href="jqueryui/jquery-ui.theme.css"/> <link rel=stylesheet type="text/css" href="jqueryui/jquery-ui.theme.min.css"/>
选项卡的基本用法
<div id="tabs"> <ul> <li><a href="#tab1">Tab1</a></li> <li><a href="#tab2">Tab2</a></li> </ul> <div id="tab1">Contents of first tab</div> <div id="tab2">Contents of the second tab</div> </div> <script> $("#tabs").tabs(); </script>
创建这种类型的页面,需要包括
引入方法后,实际上是将其html重写了。
如果要重写他的样式,可以插入<style>并且要放在引入文件句子的后面
<style type="text/css"> li.ui-state-default { font-size:10px; } div.ui-tabs-panel { font-size:15px; font-family:Georgia; font-style: italic; } </style>
标签:技术分享 family tabs ryu second 插入 size cat html
原文地址:http://www.cnblogs.com/forri/p/6351489.html