Learning HTML & CSS
This section contains resources for learning HTML & CSS. The two languages are so interrelated it only makes sense to learn them in parallel.
Note this is a living document and is constantly being updated. Some things may come and go over time.
Beginner¶
A beginning HTML and CSS programmer is someone that is new to both languages and possibly programming. This set of resources spans learning what each language is, how they work together, and the basics of more front-end design oriented topics such as fluid design, responsive design, and mobile design.
HTML¶
There is no shortcut to learning HTML or CSS. The best teacher is practice and application. Make things, break things, and analyze why certain HTML tags or CSS selectors work (or don't). Make use of a live server type environment to speed up your development workflow.
Language¶
Document¶
- HEAD - A list of everything that could go in the head of your document
Tutorials¶
Tools¶
CSS¶
Language¶
Tutorials¶
Tools¶
Intermediate¶
An intermediate HTML and CSS programmer is someone that is familiar with both languages and can build simple pages and functional websites based off mockups or wireframes.
CSS Units¶
- W3 CSS Units
- CSS values and units
- Web Style Sheets CSS tips & tricks
- Your Ultimate Guide to CSS Units – All You Need to Know
- CSS Units Best Practices
- The quick guide to CSS length units
Resets & Boilerplates¶
CSS Normalize & Resets¶
- Reboot, Resets, and Reasoning
- Normalize.css
- CSS Tools: Reset
- What is the difference between Normalize.css and Reset CSS?
Boilerplates¶
Positioning & Layout¶
Box Model¶
Positioning¶
Layouts, Grids, Flexbox¶
Media Queries¶
- Using media queries
- Responsive web design
- Media Queries for Standard Devices
- Media Queries Demystified: CSS Min-Width and Max-Width
Tools¶
- CSS Media Queries - Great tool for inspecting which media queries apply to your current device
- Simple CSS Media Queries - Tool for generating media queries for devices
- Test Responsive and Device Specific Viewports in Google Chrome
Advanced¶
An advanced HTML and CSS programmer is someone that is an expert with both languages and can architect nearly any possible website for any possible platform.
CSS¶
CSS Specificity Hierarchy¶
- What is CSS specificity hierarchy
- W3: Calculating a selector's specificity
- CSS Specificity Calculator - Really useful!
CSS Ninja¶
- CSS Best Practices – 14 Steps to Become a CSS Ninja Pt1
- CSS Best Practices – 14 Steps to Become a CSS Ninja Pt2
Other¶
Handbooks, Guides, Interview Questions¶
- Front-End Interview Handbook
- Back-End Developer Interview Questions
- Tech Interview Handbook
- Code Guide by @mdo - A guide by the author of Bootstrap.