Template inline styles

You can embed CSS styles directly into the HTML template by putting them inside <style> tags.

  selector: 'app-hero-controls',
  template: `
      button {
        background-color: white;
        border: 1px solid #777;
    <button (click)="activate()">Activate</button>

You can also write tags into the component's HTML template.

  selector: 'app-hero-team',
  template: `
    <!-- We must use a relative URL so that the AOT compiler can find the stylesheet -->
    <link rel="stylesheet" router-link="ded171fe-42bf-62a8-018e-fb47fc41462f" href="/latest/styling/assets/hero-team.component.css">
      <li *ngFor="let member of hero.team">