CSS 伪类、伪元素、选择器的使用

最新推荐文章于 2021-06-09 18:34:13 发布
最新推荐文章于 2021-06-09 18:34:13 发布
阅读量490 收藏
点赞数
分类专栏： css
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_28556553/article/details/46652893
版权

我们常用的伪类有：
:active　　　用在移动端触摸后
:focus　　　 元素获取焦点后
:hover　　　 鼠标移动到元素上后
:visited　　　被访问过的链接


我们常用的伪元素有：
:before　　　在某元素之前插入某些内容
:after　　　　在某元素之前后入某些内容


css3中常用的选择器：
:disabled　　　禁用的input
:checked　　　 被选中的input

qq_28556553
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
css3 伪元素和伪类选择器详解
09-25
无论是伪类还是伪元素，都属于CSS选择器的范畴。所以它们的定义可以在CSS标准的选择器章节找到。分别是 CSS2.1 Selectors 和 CSS Selector Level 3，两者都已经是推荐标准。
html中伪类选择器
小白
10-23 5751
html中伪类选择器 伪类选择器，并不是像之前css中选择器一样，选择一种标签，而是选择标签的一种状态，是属于html标记语言内容。    例如以a标签为例，    a:link{ }    表示鼠标没有被点击之前。CSS。    a:hover{ }   表示当鼠标放在标签上时，CSS变化。    a:active{ }  表示鼠标点击的瞬间，CSS发生变化。    a:visite
CSS3中的伪类选择器详解
maiziedu的博客
12-26 419
  类选择器和伪类选择器区别 　　类选择器我们可以随意起名，而伪类选择器是CSS中已经定义好的选择器，不可以随意起名。 　　 伪类选择器以及伪元素 　　我们把它放到这里 　　p.aaas{ 　　text-align: left; 　　color: red; 　　}       它同样的会被选择 　　最常见的伪类选择器 　　未被访问的链接 　　a:link{ colo...
CSS中一些利用伪类、伪元素和相邻元素选择器的技巧
weixin_33750452的博客
10-16 311
前几天遇到一个页面需求是这样的： 一个评论框，后面的按钮有点赞或者发送评论两种状态，其中发送按钮有根据输入框中是否有字分为可点击和不可点击两种状态。 需求：没有文字，没有聚焦——点赞没有文字，聚焦——灰色发送有文字——红色发送 如果用JS实现，需要监听输入框的change和focus事件，比较麻烦。但是用CSS中的伪类就可以实现相近效果...
伪类选择器和伪类元素的用法
weixin_42446516的博客
01-19 412
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...
CSS伪类/伪元素选择器整理
09-25
CSS伪类及伪元素选择器，如超链接的a：link、a：visited、a：hover等等，本文整理了一些，喜欢的朋友可以收藏下
css伪类伪元素域高级选择器的介绍
09-25
css伪类伪元素域高级选择器的介绍，需要的朋友可以参考一下
四种css 伪类选择器
09-25
伪类，用于给元素的片段添加样式，这如何理解呢？比如你要让一个段落的第一行的文字加粗，那么这个选择器是不二之选
使用CSS3伪类元素（::before|::after）对文字进行美化
Just Code
10-15 2908
如果要想把一个文字的分成两半分别设置成不同的颜色，你是不是第一时间只想到通过PS来实现呢，不过有一个不好的地方就是图片会占用更多的资源。所以下面就给大家介绍一个通过CSS的伪类元素来美化文字的方法。     对一个文字进行美化     左右型美化   HTML代码 &lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&g...
伪类选择器的用途
dairenwu的博客
09-22 2334
伪类选择器的用途 1.做鼠标移入、移出效果切换 a:hover { background-color: #e01222; color: #fff; }2.画三角形.triangle:before{ content:""; display:block;
HTML— 伪类选择器
qq_41420688的博客
04-18 2866
伪类选择器： 当前鼠标对标签的状态 1）link状态：鼠标没有访问过的状态 2）hover状态：鼠标经过的状态 3）active状态：鼠标激活状态（鼠标点击了，但是没有松开的状态） 4）visited状态：鼠标已经访问过的状态（鼠标点击且松开的状态） 提示：在 CSS 定义中，a:hover 必须被置于 a:link 和 a:visited 之后，才是有效的。 a:active 必须被...
html伪类选择器怎么使用,CSS3 :default伪类选择器使用简介
weixin_36366711的博客
06-04 1158
一、CSS3 :default伪类选择器简介CSS3 :default 伪类选择器只能作用在表单元素上，表示默认状态的表单元素。举个例子，一个下拉框，可能有多个选项，我们默认会让某个 处于 selected 状态，此时这个 可以看成是处于默认状态的表单元素(例如下面示意代码的“选项4”)，理论上可以应用 :default 伪类选择器。选项1选项2选项3选项4选项5选项6假设CSS如下：opti...
html伪类选择器的用法,css :first-letter伪类选择器使用实例及分析
weixin_42550597的博客
06-09 867
css :first-letter介绍css:first-letter选择器选取指定元素文本内容的第一个字母，即用于设置第一个字母的css样式。语法：:first-letter {style properties}如：h1:first-letter {font-size: 166%;}/*用于设置h1标签里面文字的第一个字母样式*/p:first-letter {text-decoration...
CSS 伪类选择器：如何使用 CSS3 伪类
whereismatrix的专栏
12-20 3963
CSS 伪类选择器：如何使用 CSS3 伪类 CSS3 是个好东西，但也很容易被她的变形（transform）和动画（其中许多特性因浏览器厂商而异）特性所迷惑，因而忘了那些已经被添加到标准规范中的最为基本的选择器。许多强大的新伪类选择器（最新的 W3C 规范中列出了 16 条）使得我们能够在新的标准范围内使用元素选择器。 在探讨这些新的 CSS3 伪类之前，先简要回顾追溯一下这
CSS-常见的伪元素选择器的用法详解
weixin_44486539的博客
09-30 868
:before 与 :after 分别在被选择元素的内容之前和内容之后插入元素，所以必须在双标签中使用伪元素选择器，在单标签中无效；使用伪元素选择器时必须要设置 content 属性来指定要插入的内容，若内容为空将其属性值设置为 '' 空字符串即可；通过伪元素选择器插入的内容默认以行内元素的形式显示；想要使其成为块元素，通过样式属性 display 转换即可；为了与伪类选择器进行区分，通常在使用时...
html伪类选择器代码,深入了解CSS伪类选择器的用法（代码示例）
weixin_30046717的博客
06-03 625
本篇文章给大家带来的内容是关于深入了解伪类选择器的用法(代码示例)，有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。前言过去零零星星地了解和使用:link、::after和content等伪类、伪元素选择器，最近看书时发现这方面有所欠缺，于是决定稍微深入学习一下，以下为伪类部分的整理。伪类伪类选择器实质上是让设计师可以根据元素特定的状态，设置不同的视觉效果。具体有:link、:vis...
伪类选择器
shuhao_Zhang的博客
09-25 109
&lt;style&gt;         /* 一般按照下面的顺序*/         /*未访问的连接*/         a:link{             font-size:16px;             color:blue;             font-weight: 700;         }         /*已访问过的链接*/         a:visite...
CSS中 伪类和伪元素的用法 --实现元素前后添加[]框
ios0213的专栏
06-16 1571
无标题文档 a{ position:relative; display:inline-block; outline:none; text-decoration:none; color:#636; font-size:24px; padding:5px 25px; } a:hover::before,a:hover::after{ position:absolute; /*注意
css3的伪类选择器和伪元素选择器
最新发布
04-01
CSS3的伪类选择器和伪元素选择器是用来选择不是文档树中实际存在的元素或状态的选择器。 伪类选择器： 1. :hover - 当鼠标悬停在元素上时触发 2. :active - 当元素被激活时触发（例如，当按钮被点击时） 3. :focus...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值