In the previous chapters, we looked at custom elements that use a shadow DOM for encapsulation and custom elements that do not use a shadow DOM. We will be styling our Web Component for both of these types.
Let's say, we have a Web Component called <company-header>. For the sake of simplicity, this header component needs to have an icon on the left-hand side with a circular border and this icon needs to be a link; the name of the page should be right next to the icon, and then there should be two other links on the extreme right-hand side, say home and about us.
This is how it should be used inside the index.html file: ...
