0

是否有可能做这种布局,你会怎么做?容器有一个边框,只是不在选项卡所在的顶部。这里只有选定的选项卡有上边框。标签的文本应该居中,左对齐也可以。但是第一个选项卡的文本不能在图像之前开始(左边应该有相同的空格)。

所需的布局

目前 html 看起来像这样,但可以根据需要进行更改:

<section class="grid-100 grid-parent tabs">
    <header>
        <ul>
            <li class="selected">Tab1</li>
            <li>Tab2</li>
            <li>Tab3</li>
        </ul>
    </header>
    <article class="tab visible">content</article>
    <article class="tab">content</article>
    <article class="tab">content</article>
    </article>
</section>
4

2 回答 2

0

您的结构可用于任何选项卡式界面或手风琴。请为您的标签提供您的 CSS。您可以使用本文中提到的引导选项卡。还有其他一些选项卡式解决方案,例如基础选项卡和 jQuery ui 选项卡。如果您正在寻找优质的响应式选项卡式解决方案,请查看 zozo tabs,其中有很多示例。

http://zozoui.c​​om/tabs

干杯

法里设计

于 2013-11-04T13:16:23.290 回答
0

这种布局是可能的,但如前所述,您需要发布您的 CSS。

看看Twitter Bootstrap,它允许您在响应式框架中放置选项卡式内容。

您需要添加一些 JS 才能使其运行,您可以通过添加“bootstrap.min.js”来执行此操作,也可以单独添加选项卡脚本。这是标签 JS 文档http://getbootstrap.com/2.3.2/javascript.html#tabs的直接链接

于 2013-09-27T10:11:43.527 回答