JQuery-UI中的tabs默认是横向显示各个标签卡，怎么修改才能让其纵向垂直显示呢？如何修改了ul属性的display为block结果还是水平横向显示标签
日期：2014-05-16 浏览次数：20338 次
JQuery-UI中的tabs默认是横向显示各个标签卡，如何修改才能让其纵向垂直显示呢？怎么修改了ul属性的display为block结果还是水平横向显示标签？
------解决方案--------------------
什么叫Tab？
tab就是横向排列的。
如果要纵向的话，就不要用这个了。考虑其他实现方式吧
------解决方案--------------------
自己研究css/ui-lightness/jquery-ui-1.8.6.custom.css改一下吧。
估计是要把li的设置成块状的样式
- HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>无标题页</title>
<link href="css/ui-lightness/jquery-ui-1.8.6.custom.css" rel="stylesheet" type="text/css" />
<script src="js/jquery-1.4.2.js" type="text/javascript"></script>
<script src="js/jquery-ui-1.8.6.custom.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function (){
$("#tabletest").tabs();
});
</script>
</head>
<body>
<div id="tabletest">
<ul style="display: block;">
<li><a href="#tb1">1</a></li>
<li><a href="#tb2">2</a></li>
<li><a href="#tb3">3</a></li>
</ul>
<div id="tb1">
<p>
1的内容</p>
</div>
<div id="tb2">
<p>
2的内容</p>
</div>
<div id="tb3">
<p>
3的内容</p>
</div>
</div>
</body>
</html>
------解决方案--------------------
什么叫Tab？
tab就是横向排列的。
如果要纵向的话，就不要用这个了。考虑其他实现方式吧
------解决方案--------------------
自己研究css/ui-lightness/jquery-ui-1.8.6.custom.css改一下吧。
估计是要把li的设置成块状的样式
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
