[ad_1]
I built a website for an initiative at my school with WordPress and an external theme(Stockholm from Qode Interactive). However in order for the the website to be published by school, it has to be compliant with accessibilty features. Currently Tab key navigation works but without highlighting the content, so ther eis no cisual feedback for the user to know what content is selected.
I wonder if this can be achieved with simple CSS command.
I couldn’t get help from wordpress as this is and external theme issue which is difficult to get support from thr developer. I can see at the lower left corner that content is selected when the Tab key is pressed.
[ad_2]
Here’s an example of how you could use CSS to highlight links when they are selected using the Tab key:
a:focus {
outline: 2px solid blue;
}
This CSS code will add a blue outline around any link that is currently selected using the Tab key.
If you want to highlight other types of content, you can apply the :focus pseudo-class to other elements in your HTML, such as buttons or form fields.
For example:
input:focus, textarea:focus, button:focus {
outline: 2px solid blue;
}