tue may 1

Goals

• I use selectors
• I can use ID's, CSS classes and pseudoclasses
• I know how to use color
• I know how to add a custom font
• I understand how the box model works to define margins and paddings

Content

• CSS Selectors
• Colors
• Webfont
• Box Model

RECAP – 30.04

1. Q&A about how to include a style.css file
2. Feedback on your webdesigns

Selectors

• Simple selectors

Pseudo-classes

• CSS Pseudo-classes
• Pseudo-classes and pseudo-elements

Colors

colorname (HTML color names / w3schools)

background-color: red; 

Hexadecimal

background-color: #ff0000; 

RGB (red, green, blue)

background-color: rgb(255,255,255);

RGBA (red, green, blue, alpha)

background-color: rgba(255,255,255, 0.5);

Color Tools

• color.adobe.com
• www.paletton.com
• coolors.co

Web System Font

• CSS Font Families
• Web Safe Font Combinations

Google Fonts

• How to include a Google Font

Box Model

• The box model
• Border - styles
• MDN border-radius | border-radius

History of Webdesign

• A brief history of web design for designers