l-1

WEB教程

主页/CSS示例代码/CSS简单示例代码/CSS 链接 示例代码

aaa

CSS示例代码

CSS 链接 示例代码

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>CSS链接样式示例</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 20px;
        }
        a {
            text-decoration: none; /* 移除下划线 */
            color: #0066cc; /* 设置链接颜色 */
            transition: color 0.3s ease-in-out; /* 平滑的颜色过渡效果 */
        }
        a:visited {
            color: #800080; /* 已访问链接的颜色 */
        }
        a:hover {
            color: #ff6600; /* 鼠标悬停时的颜色 */
            text-decoration: underline; /* 添加下划线 */
        }
        a:active {
            color: #ff0000; /* 点击时的颜色 */
        }
        .highlight-link {
            font-weight: bold; /* 加粗 */
            padding: 5px 10px; /* 增加内边距 */
            background-color: #f0f0f0; /* 背景颜色 */
            border-radius: 5px; /* 圆角 */
        }
    </style>
</head>
<body>

<h1>欢迎来到找找网</h1>

<p>这是一个本站首页链接的例子：<a href="https://www.zhaozhao123.cn/" target="_blank">找找网</a>。</p>

<p>这是另一个带有高亮样式的高亮链接<a class="highlight-link" href="https://www.zhaozhao123.cn/" target="_blank">找找网</a>。</p>

</body>
</html>