Learn HTML & CSS
HTML - HyperText Markup Language, commonly referred to as HTML, is the standard markup language used to create web pages. Web browsers can read HTML files and render them into visible or audible web pages. HTML describes the structure of a website semantically along with cues for presentation, making it a markup language, rather than a programming language.
CSS - Cascading Style Sheets (CSS) is a style sheet language used for describing the look and formatting of a document written in a markup language. Although most often used to change the style of web pages and user interfaces written in HTML and XHTML, the language can be applied to any kind of XML document, including plain XML, SVG and XUL. Along with HTML and JavaScript, CSS is a cornerstone technology used by most websites to create visually engaging webpages, user interfaces for web applications, and user interfaces for many mobile applications.
Liken to constructing a house, one might consider HTML the framing and CSS to be the painting & decorating.
General Learning:
- Absolute Centering in CSS [read]
- codecademy.com HTML & CSS [interact]
- CSS Positioning [watch][$]
- Front End Web Development: Get Started [watch][$]
- Front-End Web Development Quick Start With HTML5, CSS, and JavaScript [watch][$]
- HTML and CSS: Design and Build Websites [read][$]
- HTML Document Flow [watch][$]
- HTML Mastery: Semantics, Standards, and Styling [read][$]
- Interneting is Hard [read]
- Intro to HTML/CSS: Making webpages [watch]
- Learn to Code HTML & CSS [read]
- Learn CSS Layout [read]
- MarkSheet [read]
- MDN: HTML [read]
- MDN: CSS [read]
- Semantic HTML: How to Structure Web Pages [watch]
- Solid HTML Form Structure [watch]
- Understanding the CSS Box Model [watch]
- Resilient Web Design [read]
Mastering CSS:
- A Complete Guide to Flexbox [read]
- CSS Diner [interact]
- CSS Selectors from CSS4 till CSS1 [read]
- CSS Secrets: Better Solutions to Everyday Web Design Problems [read][$]
- CSS3 [read]
- CSS In-Depth, v2 [watch][$]
- What the Flexbox?! A Simple, Free 20 Video Course That Will Help You Master CSS Flexbox [watch]
- 30 Seconds of CSS - A curated collection of useful CSS snippets you can understand in 30 seconds or less. [read]
References/Docs:
- CSS Triggers...a Game of Layout, Paint, and Composite
- cssreference.io
- cssvalues.com
- Default CSS for Chrome Browser
- Head - A list of everything that could go in the of your document
- HTML Attribute Reference
- MDN CSS Reference
- MDN HTML Element Reference
Glossary/Vocabulary:
- CSS Glossary - Programming Reference for CSS Covering Comments, Properties, and Selectors
- CSS Vocabulary
- HTML Glossary Programming Reference for HTML elements
Standards/Specifications:
- All W3C CSS Specifications
- All W3C HTML Spec
- Cascading Style Sheets Level 2 Revision 2 (CSS 2.2) Specification
- CSS Indexes - A listing of every term defined by CSS specs
- The Elements of HTML from the Living Standard
- Global Attributes
- The HTML Syntax from the Living Standard
- HTML 5.2 from W3C
- Selectors Level 3
Architecting CSS:
Authoring/Architecting Conventions:
- CSS code guide [read]
- css-architecture
- cssguidelin.es [read]
- Idiomatic CSS [read]
- MaintainableCSS [read]
- Standards for Developing Flexible, Durable, and Sustainable HTML and CSS [read]
HTML/CSS Newsletters:
NOTES:
Writing CSS in JS was hot this year. Make sure you are aware of the use case. And why some think it is overused.