Grids and other CSS concepts: Prep

In this session we will learn about grids, positioning, pseudo elements and pseudo classes. Also we will be using CSS to create navigation features and some basic layouts.

Learning outcomes

• Grids
• Positioning, z-index
• Pseudo class, pseudo elements
• Attribute selectors
• Navigation

Pre-sessional activities

Priority

Frain, Ben; "Chapter 5: Layout with CSS Grid"; Responsive Web Design with HTML5 and CSS : Develop Future-Proof Responsive Websites Using the Latest HTML5 and CSS Techniques, 3rd Edition

Learndev, "Learn CSS Grids the Easy Way", 8 mins 59 seconds, 16 July 2024

Bro Code, "Learn CSS positions in 6 minutes!", 6 mins 23 seconds, 21 September 2023

Bro Code, "Learn CSS pseudo-classes in 7 minutes", 7 mins 37 seconds, 21 September 2023

Bro Code, "Learn pseudo-elements in 4 minutes", 4 mins 48 seconds, 7 September 2021

CodemanAcademy, "z-index CSS tutorial", 37 seconds, 22 October 2023

Also recommended

Robbins, Jennifer; "CSS Layout with Flexbox and Grid"; Learning Web Design : A Beginner's Guide to HTML, CSS, JavaScript, and Web Graphics.