- Trending Categories
Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
:active pseudo class in CSS
Pseudo class is to show different state of an element or a css selector. Active pseudo class is to show that the element is in active state.
This pseudo class is mostly being associated with link and button or any other element which can be active.
For example if it is associated with link that the link is active.
Syntax
a:active { color:green;}Let's check the actual usage of :active pseudo class with different scenarios, as follows −
Example
<html>
<head>
<style>
a:active { color:green;}
</style>
</head>
<body>
<a href="https://www.tutorialspoint.com">Click here to learn</a>
</body>
</html>Explanation
When you first time see the link it will be shown with normal link color (Blue) and the link will turn green if this link has been visited once.
Example
<html>
<head>
<style>
a:active {font-size:20px;}
</style>
</head>
<body>
<a href="https://www.tutorialspoint.com">Click here to learn</a>
</body>
</html>Explanation
This will change the font size of the link to 20px while you click on the link.
Example
<html>
<head>
<style>
body:active {
background: seagreen;
}
</style>
</head>
<body>
<div>click anywhere in this window</div>
</body>
</html>Explanation
When you click anywhere on the screen the background color will change to seagreen.
Example
<html>
<head>
<style>
#thisButton:active { color: red}
</style>
</head>
<body>
<button id="thisButton">Click Me!!</button>
</body>
</html>Explanation
Font-color of button text will change to red while you click on the button.
Browser compatibility
| Chrome | Firefox | Edge | IE | Safari | Opera |
| 1 | 1 | Yes | 4 | 1 | 5 |
702 Views
