CSS basic

by AlexMM

HTML

<span>Span 1</span>
<span id="mi-span">Span 2</span>

<br>
<br>

<div>
  <div>Div 1</div>
  <div class="orange-background">Div 2</div>
  <div class="orange-background">Div 3</div>
</div>

<br>
<br>

<span id="last-span">Span 3</span>

CSS

/* Define style for a tag */
span {
  border: 5px solid black;
}

div {
  border: 5px solid grey;
}

/* Define style for an id (unique) */
#mi-span {
  background-color: #7FFFD4;
}

/* Stronger rules override weaker ones */
div > div {
  border: 5px solid rgb(0, 0, 255);
}

/* Define style for a class */
.orange-background {
  background-color: orange;
}

/* Check margin and padding */
#last-span {
  margin-left: 20px;
  padding-top: 15px;
  color: red;
}