Build a Stylized To-Do List - 构建一个风格化的待办事项列表

Chinese 中文 HTML-CSS
1

告诉我们发生了什么：

我设置了text-decoration:none但是下划线未消，同时我无法完成以下情况：

  1. 你的 a 元素不应有任何文本装饰。
  2. 未访问的 link 应设置为你选择的颜色的文本颜色。
  3. 当鼠标悬停时，links 应该改变颜色。
  4. 当链接被点击时，链接应改变颜色。
  5. 当获得焦点时，link 应该有轮廓。
  6. 链接在访问后应改变颜色。

到目前为止你的代码

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <title>Styled To-Do List</title>
</head>

<body>
    <ul class="todo-list">
        <li>
            <label for="hover">
                <input type="checkbox" id="hover">
                Never Give up
            </label>
             <ul class="sub-item">
                <li>
                    <a class="sub-item-link" href="https://www.freecodecamp.org/chinese" target="_blank"  >D</a>
                </li>
             </ul>
            
           
        </li>
        <li>
            <label for="focus">
                <input type="checkbox" id="focus">
                BAELIEVE YOURSELF
            </label>
            <ul class="sub-item">
                <li>
                    <a class="sub-item-link" href="https://www.freecodecamp.org/chinese" target="_blank">C</a>
                </li>
            </ul>
            
            
        </li>
        <li>
            <label for="rador">
                <input type="checkbox" id="rador">
                Get up
            </label>
            <ul class="sub-item">
                <li>
                    <a class="sub-item-link"  href="https://www.freecodecamp.org/chinese/t" target="_blank">B</a>
                </li>
            </ul>
            
            
        </li>
        <li>
            <label for="lost">
                <input type="checkbox" id="lost">
                Reach
            </label>
            <ul class="sub-item">
                <li>
                    <a class="sub-item-link" href="https://www.freecodecamp.org/chinese/a" target="_blank">A</a>
                </li>
            </ul>
            
            
        </li>
    </ul>
</body>

</html>

/* file: styles.css */
a:link{
  color:brown;
}

a:visited{
  color:green;
}

a:hover{
  color:yellow;
}

a:focus{
  color:black;
  outline:3px solid red;
}

a:active{
  color:blue;
}

a {
    text-decoration:none;
  }

你的浏览器信息：

用户代理是： Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/141.0.0.0 Safari/537.36 SLBrowser/9.0.8.3131 SLBChan/115 SLBVPV/64-bit

挑战信息：

Build a Stylized To-Do List - 构建一个风格化的待办事项列表

2

欢迎来到论坛 @DownArea

html.index 是如何链接到 styles.css 文件的？

祝您编码愉快！

3

谢谢，刚开始的时候没注意到，现在成功了，谢谢你的帮助

1 Like