带有css的选项卡菜单，用于电子邮件时事通讯

Question

我正在尝试建立一个电子邮件时事通讯的选项卡菜单，我被困在选择css中的元素。问题是，我是否可以只用css创建选项卡菜单，只用css选择器选择，而不创建表单标签。

这是我的html代码：

<body>

<table class="tabs">

    <td id="tab1" class="title1">
        <h2><a href="#tab1">Tab 1</a></h2>

    <div id="div1">
    <p>This content appears on tab 1.</p></div>
    </td>

    <td id="tab2" class="title2">
        <h2><a href="#tab2">Tab 2</a></h2>
    <div id="div2"><p>This content appears on tab 2.</p></div>

    </td>

    <td id="tab3" class="title3">
        <h2><a href="#tab3">Tab 3</a></h2>
    <div id="div3"><p>This content appears on tab 3.</p></div>

    </td>


</table>

</body>

这是我的css代码：

#tab1:target + div,
#tab2:target + div,
#tab3:target + div{
    background-color: green;
}

我想要达到的是滑块效果，或者像手风琴一样的效果，但带有标签，当按下第二个标签按钮时，第二个标签内容将出现。

Answer 1

如果你发现它与你想要的相似，你可以通过这个链接。

'http://freshinbox.com/blog/interactive-tabs-for-email/'