How to disable View (css) Encapsulation in Angular

Last Updated on February 16, 2022 by Pupli

A component’s styles can be encapsulated within the component’s host element so that they don’t affect the rest of the application.

import {ViewEncapsulation} from '@angular/core';

  selector: 'my-zippy',
  templateUrl: 'my-zippy.component.html',
  styles: [`
    .zippy {
      background: green;
  encapsulation: ViewEncapsulation.None
class ZippyComponent {
  @Input() title: string;