You can start with the very first tutorial or if you already know a little HTML and CSS then you can jump to any tutorial you like. You can find all the HTML and CSS tutorials and also some free web page templates below. When you see a word in a tutorial that is underlined with a dotted line you can click or tap on it for a definition of that word.
HTML & CSS Tutorials:
- Getting started with HTML5 and CSS3
- Paragraphs, line breaks and headings in HTML
- Basic text formatting
- Lists in HTML
- Linking pages in HTML
- Adding images to your web page
- Adding audio to your web page
- Adding video to your web page
- Using CSS to style your web page
- Using external style sheets (CSS)
- CSS font properties
- Using your own fonts (with the @font-face rule)
- Adding a text-shadow or glow effect
- How to add padding
- How to add borders
- How to add margins
- Divs and spans
- Background images and colours
- Class selector
- ID selector
- Arranging content using float and clear
- Creating a basic CSS layout
- Parent/child elements
- Pseudo classes
- Styling your links
- Linking to content on the same page
- CSS nth-child() selector
- Styling lists
- Horizontal lists
- Rounded corners on a div
- Linear gradients
- Tables – Part 2 (rowspan and colspan)
- Creating a simple horizontal navbar (menu)
- Creating a vertical navigation menu
- Parallax scrolling effect UPDATED!
- Drop-down menus
- Automatic image slideshows
Use the colour picker to get hexadecimal codes for hundreds of colours to use in your CSS code.
HTML5 Canvas Tutorials
Click here to check out the HTML5 canvas tutorials.
- HTML and CSS layout template with horizontal menu links
- HTML and CSS layout with vertical menu buttons
Where to next?
You can also then check out the Responsive Web Design tutorials if you are interested in making mobile web apps or if you want to make your pages display nicely across different devices and screen sizes.