HTML tags and CSS selectors

HTML Summary

<tag>	Description
h1 - h6	Headings 1 to 6
b, i, s	bold (strong), italic (em, dfn, var), strikethrough
br, p, span	span displays inline (no height and width) while p displays block and has default margins
dl, dt, dd	Definition list, definition term, definition description
ol, ul, li	Lists and list items
code, samp, kbd	computer code, sample output, keyboard input
mark	highlighted text
small
table, tr, td, th	Table, New row, New data cell, Table header
form, input, textarea, select, keygen, output
input[type]	button, checkbox, file, hidden, image, password, radio, reset, submit, text, color, date, datetime-local, email, month, number, range, search, tel, time, url, week

CSS Summary

Transformations

(requires ms, moz, webkit in most cases)

transform:

translate(x,y) | translateX(n) | translateY(n)
rotate(Ndeg)
scale(x,y) | scaleX(n) | scaleY(n)
skew(x,y) | skewX(n) | skewY(n)
matrix(n,n,n,n,n,n)

@keyframes VarPropertyName { 
	from{property: value;}
	to{property:value;}
}

div {
	animation: VarPropertyName 10s;
}

Form

<form id="" action="" autocomplete enctype method="" name="" novalidate target="">
	<label for="name">Label</label>
	<input type="" name="" id=""></input>
	
	<select name="">
		<option value="">Option</option>
	</select>

	<textarea name="" rows="10" cols="30"></textarea>

	<input list="" name="">
	<datalist id="">
		<option value="">
		<option value="">
	</datalist>

	<output name="" for=""></output>

	<button onclick="">Button</button>
</form>

Pseudo Class Selectors

Forms

:focus - for active input fields

:checked - for radio and checkbox input

:required / :optional

:valid / :invalid

Pseudo Element Selectors

::before / ::after

Forms

::webkit-inner-spin-button
::webkit-outer-spin-button