鱼C论坛

 找回密码
 立即注册
查看: 2840|回复: 3

[学习笔记] 035-动态伪类选择器 | css3

[复制链接]
发表于 2020-3-1 19:58:19 | 显示全部楼层 |阅读模式

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

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

x
本帖最后由 liuzhengyuan 于 2020-3-23 12:51 编辑

《零基础入门学习web开发》第36讲 初学CSS的噩梦II | 学习笔记



伪类选择器:
伪类选择器.png

动态伪类选择器:
036-1.png

代码:
<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>036-动态伪类选择器</title>
    <style>
    </style>
</head>
<body>
    <a href="http://demo.fishc.com" target="_blank">戳戳我吧!!!</a>
</body>
</html>

1,
在stlye标签里加上
a:link {
            color: blue;
        }
        a:visited {
            color: red;
        }
        a:hover {
            color: green;
        }
        a:active {
            color: yellow;
        }
就是这样:
036-1.gif
必须有规律:
Love & Hate


2,更多
:active {
            background-color: black;
        }
        button:active, p:active{
            color: white;
            font-size: xx-large;
        }
效果:
036-3.gif
:active 可以在看似不可以被点击的标签上起作用


3,:focus
.a:focus {
            background-color: pink;
        }
        .b:focus {
            background-color: cornflowerblue;
        }
效果:
036-4.gif

本帖被以下淘专辑推荐:

想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复

使用道具 举报

发表于 2020-3-1 20:00:18 | 显示全部楼层
有水印
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

 楼主| 发表于 2020-3-1 20:02:42 | 显示全部楼层
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

发表于 2020-3-2 13:55:46 | 显示全部楼层
@liuzhengyuan   为什么我写的:link好像设置的color无效但background-color却有用。。。
想知道小甲鱼最近在做啥?请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

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

GMT+8, 2024-11-23 16:16

Powered by Discuz! X3.4

© 2001-2023 Discuz! Team.

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