Question

我在html中有这个：

<li *ngFor="let menu of menus" class="{{ menu.attributes.class }} menu-items" [attr.data-title]="menu.label">
    <a [routerLink]="[menu.url||'/']" [queryParams]="menu.refParameter3 ? menu.refParameter3:{}"(click)="clicked = true;selectMenu(menu)">
        <i *ngIf="menu.icon" class="{{menu.icon}}"></i>
        <span>{{menu.label}}</span>
        <i *ngIf="menu.children && menu.children.length" class="subarrow fa fa-angle-right"></i>
    </a>

    <z-menu class="childrens" *ngIf="menu.children && menu.children.length" [menus]="menu.children" [parent]="menu.label"></z-menu>
</li>

在css中我有这个：

.menu-items:hover::before {
  content: attr(data-title);
  position: absolute;
  bottom: -80px;
  display: inline-block;
  padding: 0px 6px;
  border-radius: 2px;
  background: #fff;
  color: gray;
  font-size: 11px;
  font-family: sans-serif;
  white-space: nowrap;
  z-index: 999;
  height: 30px;
  min-width: 100px;
  left: 17px;
  text-align: center;
  line-height: 30px;
  font-weight: bold;
  border: 1px solid gray;
  visibility: 1s
}

所以我想要的是当我悬停在具有childrens类作为父级的li之前隐藏在父元素上的内容之前。有什么建议吗？

Answer 1

我真的不明白你想要达到的目标！

您是否希望默认显示:before选择器，然后将鼠标悬停在li类的childrens元素上后隐藏它？这就是你想要的吗？

请按照@CBroe的建议做。

如何隐藏：在父母的内容之前悬停在孩子身上？

1 个答案: