What I learned this week… #003

  • only use class and id selectors if we have to. Reduce the amount of markup
  • use semantic elements unless not available
  • stacked margins collapse & take the smaller of the two
  • cascade & inheritance
  • using comments

typography

  • benefit the user
  • clarity
  • personality

key typographic properties

  • font-family: Preffered font, “Windows font”, Mac, Keyword
  • eg. font-family: Georgia, “Times New Roman, Times, Serif;
  • font-size
  • line-height
  • text-align
  • font-weight
  • font-style

more properties:

  • text-decoration
  • text-transform
  • text-indent
  • letter-spacing – use with caution
  • word-spacing – use with caution
  • font-variant – font specific (not all fonts have variants)

variable fonts

font similrity with pairings

body in css – always set

  • background colour
  • font family
  • fomt size
  • line height
  • colour

link states & styling – must include:

  • a:link
  • a:visited
  • a:hover
  • a:active
  • a:focus – this is for use with a tab key to select

Refers to the link as a box, not just the text

a:link, a:visited {

display: inline-block;

padding: 1px; /*gives a little extra room to use the link button */

color: #64e0e3;


Leave a Reply

Your email address will not be published. Required fields are marked *