CSS: Links

In CSS, links (anchor tags <a>) can be styled using various properties to change their appearance, including color, text decoration, hover effects, and more. Here's an overview of how you can style links in CSS:

• Link Color (color): You can set the color of links using the color property.

a {
    color: blue; /* Default link color */
}

a:hover {
    color: red; /* Link color on hover */
}

• Text Decoration (text-decoration): This property controls the decoration applied to text, such as underlining links.

a {
    text-decoration: underline; /* Underline links */
}

a:hover {
    text-decoration: none; /* Remove underline on hover */
}

• Hover Effects: You can apply specific styles to links when users hover over them using the :hover pseudo-class.

a {
    color: blue; /* Default link color */
    text-decoration: underline; /* Underline links */
}

a:hover {
    color: red; /* Link color on hover */
    text-decoration: none; /* Remove underline on hover */
}

• Visited Links (:visited): The :visited pseudo-class allows you to style links that have been visited by the user.

a:visited {
    color: purple; /* Styling visited links */
}

• Active Links (:active): The :active pseudo-class styles links when they are clicked or activated.

a:active {
    color: green; /* Styling active links */
}

Link Cursor (cursor): You can change the cursor style when hovering over links to provide visual feedback to users.

a {
    cursor: pointer; /* Change cursor to pointer on links */
}

• Link Background (background-color): You can add a background color to links for emphasis or visual effects.

a {
    background-color: yellow; /* Background color for links */
}

• Removing Default Styles: Browsers often apply default styles to links. You can remove these defaults to start with a clean slate.

a {
    color: inherit; /* Use the parent's color */
    text-decoration: none; /* Remove default underline */
}

These are some of the common CSS properties and pseudo-classes used to style links and create interactive and visually appealing navigation elements on web pages.