Welcome!
This is a simple HTML and CSS Cheatsheet.
Navigate using the side menu shortcuts to find the information you're looking for.

Introduction

HTML stands for Hyper Text Markup Language and is a fundamental building block of everything on the web, as it is the code that is used to structure a web page and its content.

HTML consists of a series of elements which you use to enclose different parts of the content to make it appear or act a certain way.

Basic Structure

An HTML element is set off from other text in a document by "tags", which consist of the element name surrounded by '<' and '>'.

The name of an element inside a tag is case insensitive. That is, it can be written in uppercase, lowercase, or a mixture.

Attributes

Attributes contain extra information about the element that you don't want to appear in the actual content. Here, class is the attribute name and editor-note is the attribute value. The class attribute allows you to give the element a non-unique identifier that can be used to target it (and any other elements with the same class value) with style information and other things.

CSS Basics

CSS (Cascading Style Sheets) is the code that styles web content.
Like HTML, CSS is not a programming language. It's not a markup language either. CSS is a style sheet language.
CSS is what you use to selectively style HTML elements.

Selector

This is the HTML element name at the start of the ruleset. It defines the element(s) to be styled (in this example, '< p >' elements). To style a different element, change the selector.

Declaration

This is a single rule like color: red;. It specifies which of the element's properties you want to style.

Note the other important parts of the syntax:

Apart from the selector, each ruleset must be wrapped in curly braces. (`{}`)
Within each declaration, you must use a colon (`:`) to separate the property from its value or values.
Within each ruleset, you must use a semicolon (`;`) to separate each declaration from the next one.

Common CSS Tools

Common CSS Tools:

width : (of an element).
background-color : the color behind an element's content and padding.
color : the color of an element's content (usually text)
text-shadow : sets a drop shadow on the text inside an element.
display : sets the display mode of an element. (keep reading to learn more)

CSS Selectors

Selector name	What does it select
Element selector (sometimes called a tag or type selector)	All HTML elements of the specified type.
ID selector	The element on the page with the specified ID. On a given HTML page, each id value should be unique.
Class selector	The element(s) on the page with the specified class. Multiple instances of the same class can appear on a page.
Attribute selector	The element(s) on the page with the specified attribute.
Pseudo-class selector	The specified element(s), but only when in the specified state. (For example, when a cursor hovers over a link.)