<commit_before>---
title: Class Equals
---
## Class Equals

This is a stub. <a href='https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/attribute/class-equals/index.md' target='_blank' rel='nofollow'>Help our community expand it</a>.

<a href='https://github.com/freecodecamp/guides/blob/master/README.md' target='_blank' rel='nofollow'>This quick style guide will help ensure your pull request gets accepted</a>.

<!-- The article goes here, in GitHub-flavored Markdown. Feel free to add YouTube videos, images, and CodePen/JSBin embeds  -->

#### More Information:
<!-- Please add any articles you think might be helpful to read before writing the article -->

<commit_msg>Add example and reason why is not commonly used (#20837)<commit_after>---
title: Class Equals
---
## Class Equals
To select an item with a class attribute, you use the following selector:

```css
p[class="happy"] {
    color: yellow;
}
```

This selector is not commonly used, as there is a general class selector. We can rewrite the above selector like this:

```css
p.happy {
    color: yellow;
}
```

#### More Information:
https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors
{'fraction_non_alphanumeric': 0.13149078726968175, 'fraction_numerical': 0.0041876046901172526, 'mean_word_length': 4.287610619469026, 'pattern_counts': {'":': 0, '<': 9, '<?xml version=': 0, '>': 9, 'https://': 3, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '7587653', 'n_tokens_mistral': 365, 'n_tokens_neox': 349, 'n_words': 127}