css set a

CSS is a style language used for web design. It can control various details such as layout, fonts, colors, etc. of web pages. Among them, setting the style of hyperlink a is also one of the commonly used techniques in CSS.

Hyperlinks are commonly used interactive elements in web pages. They can link to other web pages, anchors on the same page, email addresses, phone numbers, etc. In CSS, the a tag can not only set the appearance of the link, but also control the style of the link in different states.

Below, we will introduce how to use CSS to set the style of a tag, including the color of the link, underline, background, etc.

1. Change the color of hyperlink text

Hyperlink text is blue by default, but we can use CSS to change it to other colors, such as red, green, etc.

To change the text color of a link, you can use the following code:

a {
    color: #ff0000;
}

In this example, we set the color of the link text to red. Alternatively, colors can be defined using color names (such as red, green, blue, etc.) or RGB values.

2. Remove the underline of the hyperlink

By default, there is an underline under the hyperlink text. If you don't want this underline, you can use the following CSS code:

a {
    text-decoration: none;
}

This code sets the underline style of the link to none, that is, no underline. Alternatively, if you only want to remove the underline of the link on hover, you can use the following code:

a:hover {
    text-decoration: none;
}

This code sets the underline style of the link on hover to none.

3. Set the color of the link when hovering

Some websites want the color of the hyperlink to change when hovering, which allows users to better identify the link. To achieve this effect, you can use the following CSS code:

a:hover {
    color: #ff0000;
}

This code sets the text color of the link on mouseover to red. Likewise, colors can be defined using color names or RGB values.

4. Set the background color of the link

Sometimes, we want to add a background color around the link to make it more eye-catching. To achieve this effect, you can use the following CSS code:

a {
    background-color: #ff0000;
    color: #ffffff;
    padding: 5px;
}

This code sets the background color of the link to red, the text color to white, and adds 5px padding around the link. The padding attribute in this code block can also be set according to actual needs.

5. Set the style of the link after it is clicked

Some websites want to show a different style after the link is clicked, indicating that the link has been visited. To achieve this effect, you can use the following CSS code:

a:visited {
    color: #999999;
    text-decoration: line-through;
}

This code sets the text color of the link after it is clicked to gray and adds a strikethrough style (text-decoration: line-through). It should be noted that this code will only take effect after the link is actually clicked.

The above are some tips and examples of using CSS to set the a tag. Through these codes, we can customize the style of hyperlinks to make the web page look more beautiful and easier to use. If you are designing a website, be sure to take advantage of CSS to control the styling of your links.

The above is the detailed content of css set a. For more information, please follow other related articles on the PHP Chinese website!