angular的样式封装

在angular中使用，使用如下代码会不生效，原因是样式的封装

 

　@mixin left($value: 10px) {
　　　　float: left;
　　　　margin-right: $value;
　　}

　　div {
　　　　@include left(20px);
　　}

import { ViewEncapsulation } from ‘@angular/core’;
@Component({encapsulation:ViewEncapsulation.None})

ViewEncapsulation.Emulated - 无 Shadow DOM，但是通过 Angular 提供的样式包装机制来封装组件，使得组件的样式不受外部影响。这是 Angular 的默认设置。

ViewEncapsulation.Native - 使用原生的 Shadow DOM 特性

ViewEncapsulation.None - 无 Shadow DOM，并且也无样式包装