-3

我真的很喜欢这个两层选项卡菜单的小提琴示例

如您所见,这是一个干净且易于理解的布局。

但是——样式化它的 CSS 在哪里?

当我将完全相同的 html 和 js 复制/粘贴到一个空白的小提琴页面中时,我得到了我所期望的不包括任何 CSS 的东西——一个看起来非常可怕的结果。

我已经尝试过所有 Fiddle 选项,但找不到任何类似于样式表的东西来绘制漂亮的菜单。

有人有什么想法吗?HTML和JS如下。

<div id="tabs">
<ul>
    <li><a href="#tabs-1">First tab</a></li>
    <li><a href="#tabs-2">Second tab</a></li>
</ul>
<div id="tabs-1">
    <p>
        <div id="tabs1">
            <ul>
                <li><a href="#tabs-11">First nested 1</a></li>
                <li><a href="#tabs-12">Second nested 1</a></li>
            </ul>
            <div id="tabs-11">
                <p>Content for first nested tab 1</p>
            </div>
            <div id="tabs-12">
                <p>Content for second nested tab 2</p>
            </div>
        </div>            
    </p>
</div>
<div id="tabs-2">
    <p>
        <div id="tabs2">
            <ul>
                <li><a href="#tabs-21">First nested tab 2</a></li>
                <li><a href="#tabs-22">Second nested tab 2</a></li>
            </ul>
            <div id="tabs-21">
                <p>Content of first nested tab 2</p>
            </div>   
            <div id="tabs-22">
                <p>Content of second nested tab 2</p>
            </div>
        </div>        
    </p>
</div>

这是js:

$('#tabs').tabs();
$('#tabs1').tabs();
$('#tabs2').tabs();
4

2 回答 2

0

它链接在侧边栏中的外部资源部分。

于 2015-06-11T21:12:37.327 回答
0

所有的 css 都来自 jQuery,所以如果你真的想要 css,你必须下载 jQuery 文件并了解 jquery 是如何工作的。

我不推荐它。没有理由这样做。

jQuery 只是提供这个来让你使用它,而不是从一开始就自己动手。

您可以从这里下载 jquery: https ://jquery.com/download/

这里有一些文档以及如何使用这个 API: http ://api.jquery.com/

于 2015-06-11T21:14:58.783 回答