Html 如何创建具有切换标签内容的表格?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/7114180/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 10:09:15  来源:igfitidea点击:

How to create a table with switching tab content?

html

提问by Chan

I want to make a table looks like this: enter image description here

我想让一张桌子看起来像这样: 在此处输入图片说明

The inside table is not an issue but don't know how to create the outer frame which includes "Item Descriptions", "Shipping", and "Returns" tabs. A minimal example would be greatly appreciated. Thank you.

内表不是问题,但不知道如何创建包括“项目描述”、“运输”和“退货”选项卡的外框架。一个最小的例子将不胜感激。谢谢你。

回答by itsmatt

You could certainly use jQuery to solve this. That's what I did when I needed some tabs. I did something like:

你当然可以使用 jQuery 来解决这个问题。当我需要一些标签时,这就是我所做的。我做了类似的事情:

<ul>
   <li><a href="#tab-description">Description</a></li>
   <li><a href="#tab-shipping">Shipping</a></li>
   <li><a href="#tab-returns">Returns</a></li>
</ul>
<div id="tab-description" class="mytabs">
</div>
<div id="tab-shipping" class="mytabs">
</div>
<div id="tab-returns" class="mytabs">
</div>

and then some jQuery to make the tabs:

然后使用一些 jQuery 来制作标签:

<script language="javascript" type="text/javascript">
   $(document).ready(function () {
      $("#mytabs").tabs({ fx: {opacity: 'toggle'} });
   });
</script>

works pretty nicely for me. Just fill in whatever your content is in each of the divs.

对我来说效果很好。只需填写每个 div 中的内容即可。

回答by amosrivera

People usually call those tabs. You can find an example in this link.

人们通常称这些标签为。您可以在此链接中找到示例。