问题可能是由于在另一个组件中使用的选择器与当前组件中使用的选择器重名,导致样式被覆盖。为了避免这种情况,可以使用对于当前组件唯一的选择器。例如,可以在该组件的class前面加上唯一的前缀,例如:
@Component({
selector: 'app-my-component',
templateUrl: './my-component.component.html',
styleUrls: ['./my-component.component.scss']
})
export class MyComponentComponent implements OnInit {
...
}
在这个例子中,我们将 app-my-component
作为选择器的前缀,确保样式不会被其他组件的选择器重写。此外,如果使用子选择器(例如 .my-class p
),则子选择器的父级元素应从当前组件中定义的选择器开始,以确保它只应用于当前组件。