Table of contents

1. CSS
2. References
3. Selectors
   1. States
   2. Pseudo Elements
4. Properties

CSS

• Cascasded Style Sheets
• Best way to perform a basic reset using the universal selector.
• box-sizing: border-box; : padding and border are included in the width and height
• h1 in header is important for google search to know what the page is all about

References

• We can use free fonts - Google Fonts
• HTML Color Picker
• CSS properties
• css_tricks
• FlexBox
• Shapes and Alignment - clip-path
• ::before and ::after

Selectors

/* All elemets */
* {
  box-sizing: border-box;
}

/* tags */
p, h1 {
  color: red;
}

/* tags nested */
section p {
  color: red;
}

/* IDs, tags, class */
#id, h1, .class {
  color: red;
} 

States

:hover
:link
:visited

Pseudo Elements

::before
::after

Properties

clip-path: polygon(0 0, 100% 0, 100% 80%, 0 100%);