ng-bootstrap手风琴将风格应用于儿童图标

Question

明星在没有关注手风琴时显示

当专注于手风琴时，星星消失了

这是我的CSS，用于显示手风琴左侧的星号：

.icon-star2.relevant-source {
  position: absolute;
  margin-left: -5em;
}

这是标记[用x替换变量来隐藏敏感信息]：

 <ngb-accordion class="accordion accordion-alternate">
           <ngb-panel class="source-accordion" *ngFor="x">
                            <ng-template ngbPanelTitle>
                                <i *ngIf="x > 0" class="icon-star2 relevant-source"
                                   title="This source contains {{x}} of the top 10 most relevant documents.">
                                </i>
                                <span class="source-link source-link-text">{{x}}</span><span class="float-right source-link">
                                {{x | number:0 }}</span>
                            </ng-template>
                            <ng-template ngbPanelContent>
                                List of documents
                            </ng-template>
                        </ngb-panel>
                    </ngb-accordion>

我的目标是在某些手风琴元素旁边有一个明星，上面有一个标题。 （原生工具提示）

我已经尝试了一些东西，但我似乎无法解决这个问题。有没有人有任何建议？

Answer 1

尝试深入

/deep/ ngb-accordion > ngb-panel> i.icon-star2.relevant-source{
 position: absolute;
 margin-left: -5em;
}