a:hover{color:red;}可以和a{font-weight:bold;}合并吗？-慕课网

首页课程实战体系课手记专栏慕课教程

a:hover{color:red;}可以和a{font-weight:bold;}合并吗？

来源：10-3 再加粗一点 - 使用font-weight设置字体粗细

烜烜

2016-01-10 15:45

合并以后效果不一样，是不是hover必须但须写呢？

写回答关注

9回答

_01234567891011

2016-01-10 16:01:12

已采纳

不能，因为a:hover是鼠标划过时状态的设置，而a是链接到另一个页面时的状态的设置。如果将a:hover中的color:red放在了a里面，那么a所设置的链接的文本颜色就是红色，而不是鼠标划过才显示红色。

2 0

烜烜

非常感谢！

2016-01-10 16:56:54

共 2 条回复 >
忆_卿

2016-04-15 14:49:24

<style type="text/css">
a:link {color: #FF0000} /* 未访问的链接 */
a:visited {color: #00FF00} /* 已访问的链接 */
a:hover {color: #FF00FF} /* 鼠标移动到链接上 */
a:active {color: #0000FF} /* 选定的链接 */
</style>
<body>
<a href="#">百度</a>
</body>
你可以去这样写写看看效果。

0 0
忆_卿

2016-04-15 14:47:41

当然要单独分开写啊，因为两个修饰的完全不是同一个状态a{}修改的是<a>标签内内容的样式，a:hover{}修改的是当鼠标移动到<a>标签上时候内容的改变。
CSS伪类常见的有这4种，这4种是需要学习了解的
a:link {color: #FF0000} /* 未访问的链接 */
a:visited {color: #00FF00} /* 已访问的链接 */
a:hover {color: #FF00FF} /* 鼠标移动到链接上 */
a:active {color: #0000FF} /* 选定的链接 */
链接的不同状态都可以不同的方式显示，这些状态包括：活动状态，已被访问状态，未被访问状态，和鼠标悬停状态。

1 0

烜烜

谢谢您的总结

2016-05-09 14:26:52

共 1 条回复 >
梦魂者

2016-02-05 14:39:32
```
a:hover{font-weight:bold;color:red;}
```
鼠标移过字体变，颜色变。
0 0
xiaodanxu

2016-02-01 17:18:18

哪里有写a:hover{color:red}

0 0
宇xixi

2016-01-17 11:56:02

不可以的，hover，鼠标移动过去的状态

0 0
echo_kinchao

2016-01-11 10:08:05

他的类型状态不同不可以的

0 0
_Fitch

2016-01-10 15:58:14

应该是不可以的

0 0
李晓健

2016-01-10 15:53:43

不可以，因为 a{xxxx} 这里的样式是一直有效的，a:hover{xxx} 这里的样式只有在鼠标在a上才有效，鼠标离开这个样式就无效。

1 0

烜烜

所以说必须单独写出来啦？

2016-01-10 16:43:34

共 1 条回复 >