激活状态

Framework7 使用所谓的“活动状态”来突出显示您点击的链接和按钮。这是为了使 Framework7 应用程序表现得像原生应用程序，而不是像网络应用程序。

它几乎与 CSS 选择器的工作方式相同:active，它添加active-state类到您点击的链接和按钮。唯一的区别是它在小的时间间隔后添加这个类，这防止了在页面滚动时出现错误的高亮显示。

所以当您编写 CSS 样式时，您应该这样编写活动状态：

/* Usual state */
.my-button {
    color: red;
}
/* Active/tapped state */
.my-button.active-state {
    color: blue;
}

您可以控制哪些元素将接收active-state类在touch.activeStateElements app parameters.

有些情况下，您可能会有嵌套的活动状态元素。您可以通过向子活动状态元素添加prevent-active-state-propagation类来防止在父元素上设置活动状态：

<div class="card card-expandable">
  <div class="card-content">
    <!-- Tap on button will prevent setting active-state on parent card -->
    <a class="button prevent-active-state-propagation">...</a>
  </div>
</div>

要禁用在元素本身（及其子元素）上设置活动状态类，我们需要向此类元素添加no-active-state类：

<!-- link without active-state -->
<a href="..." class="link no-active-state">...</a>