制表

使用 Tabs 元素将响应式选项卡式内容添加到您的 Webflow 项目。

在本教程中:

  1. 包含标签
  2. 将内容附加到标签
  3. 设计选项卡

包含标签

标签图标缩略图

要合并制表元素,请访问 插入面板 并向下导航到组件部分。然后点击并拖动 制表 元素将其定位在画布上。它将自动占据其所在容器的宽度。

组件部分包含的 11 个元素是背景

表格结构

Tabulations 元素包括 制表符包装器,其中有 制表菜单制表内容.

将内容附加到选项卡

切换到选项卡后,您可以使用以下几种方法将元素集成到选项卡窗格中:

样式表

您可以自定义制表组件中的每个元素。

活动选项卡和休眠选项卡之间的区别。例如,您可以修改字体颜色和背景颜色,以区别于常规选项卡。要自定义当前选项卡,只需单击动态选项卡链接即可。

显示一组名为“月度计划(选定)”、“年度计划”和“一百五十年计划”的选项卡。

使用悬停效果与标签页进行交互

您可以按照以下提示为标签页添加悬停效果:

  1. 选择当前未激活的标签
  2. 选择 徘徊状态 下拉列表
  3. 根据你对悬停视觉效果的偏好设计标签
  4. 选择 没有任何 在州下拉菜单中
  5. 将造型部门的转变与所青睐的流畅度和时间框架结合起来
第一步,在左侧选择“年度计划”选项卡。第二步,在右侧,在州下拉菜单中选择“悬停(突出显示)”。

表现形式改变 

要管理不同选项卡窗格之间的切换:

  1. 确定任意一个标签元素
  2. 前往 元素设置面板
  3. 选择温和的 缓动方法下拉菜单
  4. 建立淡入/淡出持续时间(毫秒)
左侧第一步,从导航器面板中选择选项卡菜单。右侧第二步,在选项卡设置面板中编辑缓动。a
麦宜云
Ewan Mak 的最新帖子 (查看全部)