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

Oliko kaikki selvää?

Kiitos palautteestasi!

Osio 1. Luku 7

Kysy tekoälyä

Kysy mitä tahansa tai kokeile jotakin ehdotetuista kysymyksistä aloittaaksesi keskustelumme

Kurssisisältö

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

Oliko kaikki selvää?

Kiitos palautteestasi!

Osio 1. Luku 7