Wie kann ich mithilfe von CSS die Farbe der ausgewählten Option in der Seitenleiste ändern? ⇐ HTML

[Guest]

Ich weiß nicht, wie ich die Farbe der ausgewählten Option in einer Seitenleiste ändern kann. Ich habe zum Beispiel 4 Optionen und klicke auf die erste Option. Ich möchte, dass die erste Option in der Seitenleiste immer eine weiße Hintergrundfarbe hat. Jetzt habe ich nur noch eine Hover-Option, mit der sich die Hintergrundfarbe ändert. Kann ich das erreichen, wenn ich nur CSS-HTML verwende? Bei meinen Recherchen habe ich einige in JavaScript und PHP gesehen, frage mich aber, ob ich das nur mit CSS und HTML machen kann. Unten ist mein aktueller Code:

Code: Select all

.flexContainer {
display: flex;
}

.flexContainer > div {
margin: 10px;
padding: 20px;
font-size: 20px;
text-align: center;
}

.sidebarContainer {
flex-shrink: 1;
}

.sidebar {
width: 200px;
background-color: #dd1d5e;
overflow: auto;
border-radius: 30px;
}

.sidebar a {
display: block;
color: white;
padding: 16px;
text-decoration: none;
}

.sidebar a:hover:not(.active) {
background-color: #ffffff;
color: #dd1d5e;
}

Code: Select all

[url=category.php]Holiday[/url]
[url=category.php]Vegetarian[/url]
[url=category.php]Dessert[/url]
[url=category.php]Cultural Cuisine[/url]