<p>This paragraph has <em>emphasized text</em> in it.</p>
<div>This div has  <strong>strong text</strong> in it.</div>
<section>
  <span>This span has <b>bold</b> text in it.</span>
  <span>This span has an  <i>italic</i> text in it</span>
</section>

html {
  color: blue;
}

p {
  color: green;
  padding: .5em;
  border: medium solid red; 
}

em {
  border: inherit;
  padding: inherit;
  /* color is inherited from p */
}

div {
  color: red;
}

div strong {
  color: purple;
  /* color: initial; */  /* inherits from browser default */  
  color: unset; /* inherits from parent element */  
}

section > span:first-child {
  color: green;
}

section {
  border: 2px solid red;
}

section > span:last-child {
  /* no color (inherited property) specified -> inherits color from root */
  /* no border (non-inherited property) specified -> inital value refers to the default value (border: none) */
  border: 4px solid green;
  border: initial; /* also initial value (border: none) */
  border: unset; /* also initial value (border: none) */
}