CSS Links

The Link is used to connect one web page to another web page. It means that the link provides a connection between two web pages.

The CSS property can be styled the links in different ways.

Links States

Links can be styled differently depending on what state they are:

  • a:link - a normal, unvisited hyperlinks
  • a:visited - a link the user has visited
  • a:hover - a link currently has the user mouse pointer hovering over it.
  • a:active - a link which the user is just clicked

Example: Styling Links

  a:link {color: Blue;} /* This is a normal link */ 
  a:visited {color: black;} /* This is a visited link */
  a:hover {color: red;} /* This is a hover link */
  a:active {color: green;} /* This is a active link */

Important Description

  • The color property is used to set the colors of the links.
  • The color property will change when you bring a mouse pointer over that link, according to the upper hover property example.

Text Decoration

The text-decoration property is used to remove underlines from link

Example: Text Decoration

  a:link {text-decoration: none;} /* underline is not visible */ 
  a:visited {text-decoration: none;} /* underline is not visible */
  a:hover {text-decoration: underline;} /* underline is visible */
  a:active {text-decoration: underline;} /* underline is visible */

Output


How To Create Link Button

Link button is the combination of several CSS properties link background-color, color, text-decoration, padding, text-align, display, etc; then it's look like a buttons.

Example: Link Button

  a:link, a:visited {
     text-decoration: none;
     background-color: pink;
     color: blue;
     text-align: center;
     padding: 20px;
     display: inline block;
     }

Output

Policy

GDATAMART.COM is optimized for learning & job information; The users try to improve your knowledge and practical experience through this site but we cannot warrant full correctness of all content... Learn More → | Sitemap →

© 2020 GDATAMART | All Rights Reserved