 Challenge
Challenge
Note
You can write the code in the
styles.cssfile of the following sandbox. To see the rendered page, drag it from the right edge of a sandbox window.
Task
In this task, you will work with the various formats of color available and how background properties can be set in HTML and CSS. Following are the tasks that you need to perform on the given code:
- Add an HSL color to the heading with 184as hue,50%saturation, and100%lightness.
- Add the same color but with an opacity(alpha) set to 0.2 for the headeras a background color.
- For nav, create a linear gradient as a background. It should fade from the color#ffd7b5on the left to#ffa400on the right.
- For a link in the nav, on hover, change the text color to #ff8a00and the background color white with an opacity set to 0.4.
 Note! To change the appearance of a link on hover, use thea: hoverselector.
- Set the background color of the footerto#ebecf0.
- For the divwith the 'codefinity' class, set the background image to aurl("https://codefinity-content-media.s3.eu-west-1.amazonaws.com/35fdd0a9-2b4b-4032-9ac4-3d848aa08650/dark-logo.svg").
 Also, set thebackground-repeattospace.
Here is the result you should get. If you are having problems, you can drag the code part with a solution from the left edge of a sandbox window
Obrigado pelo seu feedback!
Pergunte à IA
Pergunte à IA
Pergunte o que quiser ou experimente uma das perguntas sugeridas para iniciar nosso bate-papo
Pergunte-me perguntas sobre este assunto
Resumir este capítulo
Mostrar exemplos do mundo real
Awesome!
Completion rate improved to 5 Challenge
Challenge
Deslize para mostrar o menu
Note
You can write the code in the
styles.cssfile of the following sandbox. To see the rendered page, drag it from the right edge of a sandbox window.
Task
In this task, you will work with the various formats of color available and how background properties can be set in HTML and CSS. Following are the tasks that you need to perform on the given code:
- Add an HSL color to the heading with 184as hue,50%saturation, and100%lightness.
- Add the same color but with an opacity(alpha) set to 0.2 for the headeras a background color.
- For nav, create a linear gradient as a background. It should fade from the color#ffd7b5on the left to#ffa400on the right.
- For a link in the nav, on hover, change the text color to #ff8a00and the background color white with an opacity set to 0.4.
 Note! To change the appearance of a link on hover, use thea: hoverselector.
- Set the background color of the footerto#ebecf0.
- For the divwith the 'codefinity' class, set the background image to aurl("https://codefinity-content-media.s3.eu-west-1.amazonaws.com/35fdd0a9-2b4b-4032-9ac4-3d848aa08650/dark-logo.svg").
 Also, set thebackground-repeattospace.
Here is the result you should get. If you are having problems, you can drag the code part with a solution from the left edge of a sandbox window
Obrigado pelo seu feedback!