← All tutorials

GoCareerGo Tutorials

CSS Tutorial

Selectors, box model, Flexbox, Grid, animation and responsive design.

Pseudo-Classes

Target elements based on STATE or POSITION rather than their tag/class/id — :hover, :focus, :nth-child, and more.

a:hover { color: coral; }
input:focus { outline: 2px solid teal; }
li:nth-child(odd) { background: #f5f5f5; }
li:first-child { font-weight: bold; }