<p>This paragraph has <em>emphasized text</em> in it.</p>
<div>This div has  <strong>strong text</strong> in it.</div>
  <span>This span has <b>bold</b> text in it.</span>
  <span>This span has an  <i>italic</i> text in it</span>
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) */

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.