html怎么设置超链接颜色及形状
方法：使用“a:link  {color:颜色值;}”、“a:visited{color:颜色值;}”、“a:hover{color:颜色值;}”和“a:active{color:颜色值;}”语句，分别设置超链接四种状态时的链接颜色即可。
本教程操作环境：windows7系统、CSS3&&HTML5版、Dell  G3电脑。
  标签定义超链接，用于从一张页面链接到另一张页面。
  元素最重要的属性是  href  属性，它指示链接的目标。
在所有浏览器中，链接的默认外观是：
超链接有四种状态：
a:link  -正常状态  未访问过的链接
a:visited  -用户已访问过的链接
a:hover  -当用户鼠标放在链接上时
a:active  -链接被点击的那一刻
上面链接的状态，在使用时有如下顺序规则：
a:hover  必须跟在a:link和a:visited后面
a:active  必须跟在a:hover后面
注意：在链接第一次被访问之前，链接是a:link设置的属性
具体用法如下：
a:link{color:red;}
a:visited{color:gray}
a:hover{color:blue;font-size:24px}
a:active{color:black}
示例：



  

这是一个链接

1.CSS中设置超链接

可能大家看着上面这个伪类语法不太好理解，其实它就是我们平时访问某一个网页时，把鼠标放在某个链接上面，然后那个链接就会改变其颜色样式。废话不多说，下面直接上实例代码：👇👇👇
1.1  实例一：  













我是一个a标签，悬浮添加下划线


运行结果如下：

1.2  实例二：













我是一个a标签，悬浮字体变红并添加下划线


运行结果如下：

1.3  实例三：













社科经典文学名著政治军事


运行结果如下：

  
2.CSS中设置鼠标形状  

这里的鼠标形状是通过  标签  cursor  来设置的，常见的一些鼠标形状如上图所示。下面我们来看一个实例：👇👇👇
2.1  实例一：  






img  {
border:  0px;
}
p  {
font-size:  14px;
}
a  {
color:  crimson;
text-decoration:  none;
}
a:hover  {
color:  dodgerblue;
text-decoration:  underline;
cursor:  help;
}
span  {
cursor:  pointer;
}


  

楼兰蜜语新疆野生  无漂白薄皮核桃

500gx2包  ￥48.8

等待的结果

运行结果如下：

这里当我们把鼠标悬浮在图片和不同的字体之上时，鼠标就会变成相应的形状，各不相同，根据喜好自行设置即可。
原文链接：https://blog.csdn.net/weixin_43823808/article/details/111592559

     返回顶部