我们可以使用Angular的ViewEncapsulation特性来避免这个问题。ViewEncapsulation有三种模式：Emulated、Native和None，默认情况下是Emulated。Emulated模式将组件的样式封装在Shadow DOM中，而不会影响全局样式。

将组件的ViewEncapsulation模式设置为None即可解决该问题。示例代码如下：

@Component({ selector: 'app-example', templateUrl: './example.component.html', styleUrls: ['./example.component.css'], encapsulation: ViewEncapsulation.None // 设置为None }) export class ExampleComponent { // 组件代码 }

然后在example.component.css中添加样式规则，它会应用于添加的ol元素。

例如，如果你有以下CSS规则：

ol { color: red; }

然后在component的CSS中添加以下规则：

.example ol { font-size: 20px; }

此时添加的

将会继承component中的样式规则。