Jeżeli chcesz zmieniać style css na kliknięcie czysto w css,
polecam pobawić się w input checkbox albo input radio.
Po odpowiednim umiejscowieniu inputów w html i zaadresowaniu ich w css można pisać style css dla jakiegokolwiek elementu na stronie, kiedy input jest zaznaczony.
Oczywiście sam input można ustawić niewidoczny, a podpięty do niego label wystylizować na przycisk.
Wtedy w css pisze się style dla jakiego się chce elementu na stronie np.
#mojinput:checked ~ .mojkontener .mojelement {
style css
}
input id="mojinput" musi się wtedy znajdować na tym samym poziomie co <div class="mojkontener">.
Element o klasie .mojelement którego chcemy stylizować po kliknięciu powinien znajdować się gdziekolwiek byle wewnątrz <div class="mojkontener">.
Label (czyli nasz przycisk) połączony z inputem może znajdować się gdziekolwiek na stronie, ważne, żeby input znajdował się w odpowiednim miejscu.
Jeżeli chcemy ominąć <div class="mojkontener"> i zaadresować w css .mojelement bez kontenera trzeba ustawić input na tym samym poziomie co dany element, przed nim. Jednak z doświadczenia wiem, że ta pierwsza metoda jest dużo bardziej praktyczna, i na jedno kliknięcie można zmieniać mnóstwo elementów na stronie, a na drugie kliknięcie cofnąć wszystkie zmiany. Radio input dodaje jeszcze więcej możliwości.