Combining type and class selectors

When you use a selector such as .subtitle in a CSS rule, you’re asking the browser to match every page element that uses the subtitle class. However, suppose your page uses that class not only in all its h2 elements, but all its h3 elements as well. How can you target just those h3 elements that use the subtitle class? By pre- ceding the class selector with the element name:

element.class-name {
	property1: value1;
	property2: value2;
}

For example, the following rule matches just the h3 elements that have the sub-title class:

h3.subtitle {
	border: 2px dashed royalblue;
}

Matching multiple classes

It’s possible (in fact, fairly common) for an element to have two or more classes. To add multiple classes to a tag, you still use the class attribute, but in the value, you separate each class name with a space. Here’s an example:

<h4 class="subtitle aside-title">

You can then target any elements that contain both classes by chaining the class selectors together, like so:

.subtitle.aside-title {
	color: red;
}