title: different background colours in div tags
body: <p>I am wondering if there is a more nice way to set 4 different background colours in CSS. I have to make the following setup:</p>
  
  <p><a href="https://i.stack.imgur.com/f87Fk.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/f87Fk.png" alt="Design Setup"></a></p>
  
  <p>Is there a more clean and nice code I can make beside this i made, or is this the only way to do it? The code is just looking really ugly after my opinion.</p>
  
  <pre><code>&lt;div class="bg1"&gt;&lt;/div&gt;
  &lt;div class="bg2"&gt;&lt;/div&gt;
  &lt;div class="bg3"&gt;&lt;/div&gt;
  &lt;div class="bg4"&gt;&lt;/div&gt;
  
  
  
  .bg1 {
      background-color: blue;
  }
  .bg2 {
      background-color: red;
  }
  .bg3 {
      background-color: green;
  }
  bg4 {
      background-color: purple;
  }
  </code></pre>