Writing Efficient CSS


Sat May 08 2021 13:25:00 GMT+0000 (Coordinated Universal Time)

Saved by @benjaminb #css

.heading {
  font-family: sans-serif;
  font-weight: 700;
.warning {
  color: yellow;
.danger {
  color: red;
.info {
  color: blue;

<h1 class="heading warning">...</h1>
<h2 class="heading danger">...</h2>
<h3 class="heading info">...</h3>

You might know how to use Class and Id now but it doesn't mean you should use them excessively. Good practice in writing efficient and manageable HTML CSS is to keep things modular, layering classes, and sharing styles from element to element. Say you want to style some headers. You can define the styles for each of the headers individually like this.