Home > Article > Web Front-end > Basic knowledge of HTML, detailed introduction to styles set by hyperlinks

Basic knowledge of HTML, detailed introduction to styles set by hyperlinks

php中世界最好的语言Original: 2018-01-22 10:36:252183browse

This time I will bring you HTML basics knowledge, a detailed introduction to the style of hyperlink setting, and notes on setting the HTML hyperlink style What are they? Here are actual cases. Let’s take a look.

***Example of setting the style of hyperlink

a:link The state before the hyperlink is clicked

a:visited The state after the hyperlink is clicked

a:hover When hovering over a hyperlink

a:active When clicking a hyperlink

When defining these states, there is an order l v h a

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
<title>无标题文档</title>  
<style type="text/css">  
a:link   
{   
    color:#000;   
    text-decoration:none;}   
a:visited   
{   
    color:#000;   
    text-decoration:none;}   
a:hover   
{   
    color:#F00;   
    text-decoration:underline;}   
a:active   
{   
    color:#F90;   
    text-decoration:underline;}   
</style>  
<link href="Untitled-1.css" rel="stylesheet" type="text/css" />  
</head>  
  
<body>  
<a href="http://www.baidu.com/">百度一下</a>  
</body>  
</html>

Running display: When the mouse arrow is not placed on "Baidu Click", it displays black - when it is placed, it displays red - when the "Baidu Click" link is clicked, it displays orange - after clicking, it displays Black

I believe you have mastered the methods after reading these cases. For more exciting information, please pay attention to other related articles on the php Chinese website!

Basic knowledge of HTML, detailed introduction to styles set by hyperlinks

Related articles