---
title: "Different way to design a Links with the help of CSS in HTML?"  
description: "Different way to design a Links with the help of CSS in HTML?"  
author: "Abhishek Srivasatava"  
published: 2016-10-13  
updated: 2020-09-15  
canonical: https://www.mindstick.com/interview/23084/different-way-to-design-a-links-with-the-help-of-css-in-html  
category: "css-css3"  
tags: ["css"]  
reading_time: 2 minutes  

---

# Different way to design a Links with the help of CSS in HTML?

**There are four state of the link.**\
Link: It is state of a link, when user never opens that link.\
Visited: It is state of a link one user already visited to the link.\
Hover: It is state of a link when user put the cursor on the link.\
Active: It is a state of a link user already opened that link in the same browser.

```
a.link{    background-color: Blue;    color: white;    padding: 20px 20px;    text-align: Right;     text-decoration: underline;    display: inline-block; /*it is used to look link into the square box*/}
```

Similarly, we can define for other status of the link. \
\
‘a’ is the keyword for the link.\
How to define the link in HTML\
<a href =”www.MindStick.com”> MindStick </a>.

##

## Answers

### Answer by Abhishek Srivasatava

**There are four state of the link.**\
Link: It is state of a link, when user never opens that link.\
Visited: It is state of a link one user already visited to the link.\
Hover: It is state of a link when user put the cursor on the link.\
Active: It is a state of a link user already opened that link in the same browser.

```
a.link{    background-color: Blue;    color: white;    padding: 20px 20px;    text-align: Right;     text-decoration: underline;    display: inline-block; /*it is used to look link into the square box*/}
```

Similarly, we can define for other status of the link. \
\
‘a’ is the keyword for the link.\
How to define the link in HTML\
<a href =”www.MindStick.com”> MindStick </a>.

##


---

Original Source: https://www.mindstick.com/interview/23084/different-way-to-design-a-links-with-the-help-of-css-in-html

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.