设为首页收藏本站
切换到窄版

鱼C论坛

 找回密码
 立即注册
鱼C论坛»论坛 › 编程语言专区 › Web开发 › 关于：link
返回列表 发新帖
查看: 3493|回复: 11

[已解决]关于：link

[复制链接]
weiter
发表于 2020-3-3 22:10:57 | 显示全部楼层 |阅读模式

马上注册，结交更多好友，享用更多功能^_^

您需要 登录 才可以下载或查看，没有账号？立即注册

x
本帖最后由 weiter 于 2020-3-4 07:30 编辑

不造为什么我在程序里已经按照实例加了:link，但是不知道为什么:link好像失效了,以下是代码和效果，求大佬解惑
我是想改一下a标签的链接的颜色，但是好像没有用。。。 HBX.png


HBX.html
X268X%D~Y(Q@{WV$A[APC19.png
  1. <!DOCTYPE html>
  2. <html>
  3.         <head>
  4.                 <meta charset="utf-8">
  5.                 <title>HBuilder X</title>
  6.                 <link rel="icon" type="image/png" sizes="16x16" href="HBX.png">
  7.                 <style type="text/css">
  8.                         h1{
  9.                                 background-color: #F5F5DC;
  10.                                 color: #8FBC8F;
  11.                                 margin: 0;
  12.                                 padding: 5%;
  13.                         }
  14.                         p{
  15.                                 color: #F5F5DC;
  16.                                 background-color: #8FBC8F;
  17.                                 margin: 0;
  18.                         }
  19.                         a{
  20.                                 background-color: beige;
  21.                                 width: 100px;
  22.                                 margin: auto;
  23.                         }
  24.                         section{
  25.                                 color: #8FBC8F;
  26.                                 padding: 20px;
  27.                                 display: flex;
  28.                                 flex-direction: row;
  29.                         }
  30.                         ::selection{
  31.                                 background-color: silver;
  32.                                 color: white;
  33.                         }
  34.                         div:hover{
  35.                                 background-color: burlywood;
  36.                                 color: #F5F5DC;
  37.                         }
  38.                         /*问题代码*/
  39.                         a:link{
  40.                                 color: darkgoldenrod;
  41.                         }
  42.                 </style>
  43.         </head>
  44.         <body>
  45.                         <h1>Hbuilder X</h1>
  46.                         <p class="show">thank you for useing <dfn>HBuilder X</dfn></p>
  47.                         <p class="show">感谢您使用<dfn>HBuilder X</dfn></p>
  48.                         <section class="section1">
  49.                                 <a href="1.html"><div>first</div></a>
  50.                                 <a href="1.html"><div>second</div></a>
  51.                                 <a href="1.html"><div>third</div></a>
  52.                         </section>
  53.                         <section class="section2">
  54.                                 <a href="1.html"><div>one</div></a>
  55.                                 <a href="1.html"><div>one</div></a>
  56.                                 <a href="1.html"><div>one</div></a>
  57.                         </section>
  58.         </body>
  59. </html>
复制代码



1.html
  1. <!DOCTYPE html>
  2. <html>
  3.         <head>
  4.                 <meta charset="utf-8">
  5.                 <title>HBuilder X</title>
  6.                 <link rel="icon" type="image/png" sizes="16x16" href="HBX.png">
  7.         </head>
  8.         <body>
  9.                 <p>开学啦</p>
  10.         </body>
  11. </html>
复制代码
最佳答案
月排行榜 / 总排行榜
liuzhengyuan
2020-3-4 11:26:53
顺序错了，link必须放hover前面
小甲鱼最新课程 -> https://ilovefishc.com
回复

使用道具 举报

wp231957
发表于 2020-3-4 06:52:58 From FishC Mobile | 显示全部楼层
两段代码？？？什么情况
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

weiter
 楼主| 发表于 2020-3-4 07:29:19 | 显示全部楼层
wp231957 发表于 2020-3-4 06:52
两段代码？？？什么情况

下面的<a>就是跳转到第二段代码的
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

wp231957
发表于 2020-3-4 08:06:30 | 显示全部楼层
weiter 发表于 2020-3-4 07:29
下面的就是跳转到第二段代码的

你想修改哪个颜色啊   我测试代码没问题啊
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

不二如是
发表于 2020-3-4 08:21:03 | 显示全部楼层
小甲鱼老师关于 link，visited、hover、active 有讲过顺序问题（初学CSS的噩梦（II））：
LoVe & HAte

这四个元素是有使用顺序滴，颠倒就无法执行想要的效果

评分

参与人数 1荣誉 +1 鱼币 +1 收起 理由
weiter + 1 + 1 可惜等级太低，评分上限只能给这么多。。。

查看全部评分

小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

wp231957
发表于 2020-3-4 08:29:52 | 显示全部楼层
  1. a:link {color:#000000;}      /* 未访问链接*/
  2. a:visited {color:#00FF00;}  /* 已访问链接 */
  3. a:hover {color:#FF00FF;}  /* 鼠标移动到链接上 */
  4. a:active {color:#0000FF;}  /* 鼠标点击时 */
复制代码


教程上是这个顺序的

评分

参与人数 1荣誉 +1 鱼币 +1 收起 理由
weiter + 1 + 1 感谢楼主无私奉献！

查看全部评分

小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

sukiwhip
发表于 2020-3-4 10:07:56 | 显示全部楼层
感觉你的 a标签 都好像被点过一样，开一个纯浏览器或者无痕模式看看对比下
你用开发者模式查一下现在标签的颜色是什么，看看伪类的颜色是什么
也可以试一下加大伪类的权重

评分

参与人数 1荣誉 +1 鱼币 +1 收起 理由
weiter + 1 + 1 感谢楼主无私奉献！

查看全部评分

小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

liuzhengyuan
发表于 2020-3-4 11:26:53 | 显示全部楼层    本楼为最佳答案   
顺序错了，link必须放hover前面
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 1 反对 0

使用道具 举报

weiter
 楼主| 发表于 2020-3-4 11:40:21 | 显示全部楼层
liuzhengyuan 发表于 2020-3-4 11:26
顺序错了，link必须放hover前面

我试一下
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

weiter
 楼主| 发表于 2020-3-4 11:40:56 | 显示全部楼层
liuzhengyuan 发表于 2020-3-4 11:26
顺序错了，link必须放hover前面

但是设置背景色却可以
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

weiter
 楼主| 发表于 2020-3-4 11:45:55 | 显示全部楼层
sukiwhip 发表于 2020-3-4 10:07
感觉你的 a标签 都好像被点过一样，开一个纯浏览器或者无痕模式看看对比下
你用开发者模式查一下现在标签 ...

无痕模式可以正常显示，但是为什么？
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

weiter
 楼主| 发表于 2020-3-4 11:46:44 | 显示全部楼层
liuzhengyuan 发表于 2020-3-4 11:26
顺序错了，link必须放hover前面

谢谢指正
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

返回列表 发新帖
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|手机版|Archiver|鱼C工作室 ( 粤ICP备18085999号-1 | 粤公网安备 44051102000585号)

GMT+8, 2025-5-5 10:40

Powered by Discuz! X3.4

© 2001-2023 Discuz! Team.

快速回复 返回顶部 返回列表