How to add an onclick effect in CSS?

Spread the love

Sometimes, we want to add an onclick effect in CSS.

In this article, we’ll look at how to add an onclick effect in CSS.

How to add an onclick effect in CSS?

To add an onclick effect in CSS, we can use the :target pseudo-class.

For instance, we write

<a href="#something">Show</a>
<div id="something">Bingo!</div>

to add a link and a div.

Then we write

#something {
  display: none;
}

#something:target {
  display: block;
}

to make the div hidden by default with

#something {
  display: none;
}

Then we make it show when we click on the link with

#something:target {
  display: block;
}

Conclusion

To add an onclick effect in CSS, we can use the :target pseudo-class.

Leave a Reply

Your email address will not be published. Required fields are marked *