Creating CSS Rule Sets

Introduction

Welcome to the Creating CSS Rule Sets Practice Lab. In this module, you will be provided with the instructions and devices needed to develop your hands-on skills.

Exam Objectives

The following exam objective is covered in this lab:

2.2 Construct and analyze rule sets

Lab Duration

It will take approximately 20 minutes to complete this lab.

Exercise 1 - Working with CSS Rule Sets

Cascading Style Sheets (CSS) rule set contains a selector and a declaration block. The selector is the HTML tag for which you want to define formatting styles. The declaration block includes the CSS properties such as background color, font color, and text alignment with values. There are different types of CSS selectors that point to HTML tags. Some of them are element, id, and class.

In this exercise, you will learn to create CSS rule sets containing different types of selectors by performing the following tasks:

• Open the VS Code workspace.
• Define web safe fonts, element selector, id selector, class selector, and pseudo classes in styles.css and use them in index.html.

Learning Outcomes

After completing this exercise, you will be able to:

• Create an external CSS rule set that uses web safe fonts
• Create a CSS rule set containing the element selector and the id selector
• Create an external CSS rule set containing the class selector and pseudo classes