tabell {
   display: table;
   border: inset 3px #333333;
   }

Elementet <tabell> skall visas som en tabell med en kant som är mörkgrå och 3 pixlar tjock

kolumnrubriker {
   display: table-header-group;
   }

Kolumnrubrikerna är de tre cellerna på första raden. De grupperas här så läsaren kan hålla reda på dem.

kolumn {
   display: table-cell;
   padding: 5px;
   background-color: #333333;
   color: #FFFFFF;
   font-weight: bold;
   border: outset 2px #FFFF00>;
   }

tabellkommandon { display: table-row-group; }

Varje rad utgör en egen grupp och detta anges här för elementet <tabellkommandon>, som innehåller alla rader.

tabellegenskap { display: table-row; }

Varje element som heter <tabellegenskap> skall utgöra en egen rad.

namn {
   display: table-cell;
   padding: 5px;
   border-bottom: solid 1px #CCCCCC;
   }

beskrivning {
   display: table-cell;
   padding: 5px;
   border-bottom: solid 1px #CCCCCC;
   }

htmlkod {
   display: table-cell;
   padding: 5px;
   border-bottom: solid 1px #CCCCCC;
   }

Alla tre visas på samma sätt, som en tabellcell med ett visst utrymme mellan texten och cellkanten (=padding), samt en färgad kant.

htmlkod:before {content: "\003C"}
htmlkod:after {content: "\003E"}

Dessa kommandon skapar ett tillägg till elementet . Tillägget är det värde som står efter "content". Tillägget läggs till före eller efter elementets innehåll. Denna finess gör i det här fallet så att vi slipper skriva in "<" och ">" före och efter varje Html-motsvarighet. Jag har försökt få reda på varför just dessa värden fungerar, men har inte lyckats något vidare. Som synes använder man inte gängse teckenkod för dessa tecken här...