liuzhengyuan 发表于 2020-3-1 19:58:19

035-动态伪类选择器 | css3

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

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

伪类选择器:


动态伪类选择器:


代码:
<!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;
      }
就是这样:

必须有规律:
Love & Hate

2,更多
:active {
            background-color: black;
      }
      button:active, p:active{
            color: white;
            font-size: xx-large;
      }
效果:

:active 可以在看似不可以被点击的标签上起作用

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

一个账号 发表于 2020-3-1 20:00:18

有水印

liuzhengyuan 发表于 2020-3-1 20:02:42

一个账号 发表于 2020-3-1 20:00
有水印

{:10_277:}

weiter 发表于 2020-3-2 13:55:46

@liuzhengyuan   为什么我写的:link好像设置的color无效但background-color却有用。。。
页: [1]
查看完整版本: 035-动态伪类选择器 | css3