Learn Accessibility by Building a Quiz - Step 46

HTML-CSS
1

Tell us what’s happening:

On the topic of visual accessibility, contrast between elements is a key factor. For example, the contrast between the text and the background of a heading should be at least 4.5:1.

Change the font color of all the anchor elements within the list elements to something with a contrast ratio of at least 7:1.

Basically, I need the css property for the contrast-ratio and its syntax.

Your code so far

<!-- file: index.html -->


/* file: styles.css */
/* User Editable Region */

li>a{
  color:dfdfe2;
  filter:contrast(7);
}

/* User Editable Region */

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/130.0.0.0 Safari/537.36

Challenge Information:

Learn Accessibility by Building a Quiz - Step 46

2

Welcome to the forum @hamzatkaosarat31

Here is a post you may find helpful.

Happy coding

3

there isn’t one, you need to choose a color that has that contrast with the color that appears below it in the page

1 Like