Challenge: User Action Pseudo-Classes

Task

We have a company website with contact information in the header section. Your task is to implement a color change when a user hovers over the links in the header section.

Steps:

Select all a elements with the header-link class.
Use the appropriate pseudo-class for the hover effect.
Apply the color property with the value blue when the links are hovered.

index.html

index.css

Use the . and the class name to select an element by its class name.
Use the :hover pseudo-class to react on mouse cursor hover.

index.html

index.css

Tudo estava claro?

Obrigado pelo seu feedback!

Seção 1. Capítulo 7

Pergunte à IA

Pergunte o que quiser ou experimente uma das perguntas sugeridas para iniciar nosso bate-papo

Conteúdo do Curso

CSS Fundamentals

1. Introduction to CSS

2. Text Styles

Text Styling Text Formatting Challenge: Text Formatting Adding Custom Fonts to the Web Page Font Properties Challenge: Fonts

3. Box Model and Element Spacing

4. Flexbox

What is the Flexbox? Flex Direction Justifying Content Horizontally Aligning Items Vertically Flex Item Properties Challenge: Flexbox Challenge: Work with Flexbox

5. Decorative Effects

Background Color Background Image Working with Images Decorative Pseudo-Elements Shadows Challenge: Decorative Effects Further Steps

Challenge: User Action Pseudo-Classes

Task

We have a company website with contact information in the header section. Your task is to implement a color change when a user hovers over the links in the header section.

Steps:

Select all a elements with the header-link class.
Use the appropriate pseudo-class for the hover effect.
Apply the color property with the value blue when the links are hovered.

index.html

index.css

Use the . and the class name to select an element by its class name.
Use the :hover pseudo-class to react on mouse cursor hover.

index.html

index.css

Tudo estava claro?

Obrigado pelo seu feedback!

Seção 1. Capítulo 7