Use of the :host selector

The :host selector can be used to target custom components from within a css environment.

Let’s have a look! 👁️‍🗨️

Given you have a custom component such as;

<album></album>

In your css you may want to style the album element from within it’s inline stylesheet.

This is where the :host selector comes in handy. Consider the below usage to add 10 pixels of margin to the album element.

:host {
  margin: 10px;
}