Week 2 – HTML and CSS Review


This week we reviewed HTML content. We created an HTML template and linked a CSS document to it. Here are additional content we covered:

Emmet
It is a plugin that helps web developers speed up writing code using specific syntax.
Example: header#banner>nav>ul>li*5>a
Source: https://docs.emmet.io/

Base Font Styles
set up and modify base font styles. We changed the default 16px to 10px by adding a :root selector in the css file. This was done to make font adjustments easier and the use ems units.

Media Queries:
so that a sites layout can adjust to different devices.

CSS Reset:
helps reset default browser parameters/settings
Source: https://meyerweb.com/eric/tools/css/reset/

Google Fonts
Implemented the google font embedded code to both CSS and HTML.

Viewport units
Controlling the dimensions of a page on different devices.

Other useful links
https://placehold.co/
https://css-tricks.com/
https://www.w3schools.com/
https://css-tricks.com/snippets/css/a-guide-to-flexbox/
https://wordpress.org/gutenberg/
Youtube HTML and CSS tutorial

Basic HTML doc structure files created in class, HTML and CSS.
Here is the link to the zip file.


One response to “Week 2 – HTML and CSS Review”

Leave a Reply

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