妙味css3课程---1-2、css3中新增的伪类和伪元素有哪些
妙味css3课程---1-2、css3中新增的伪类和伪元素有哪些
一、总结
一句话总结:
1、div:target{}是什么意思?
比如a标签的锚点链接到div,div:target{}就可以找到这个div
E:target { sRules }
匹配相关URL指向的E元素。
2、如何用input框模拟单选框?
用input:checked属性可以找到我们点击的input框,然后就能实现背景发生改变,模拟选中
E:checked { sRules }
匹配用户界面上处于选中状态的元素E。(用于input type为radio与checkbox时)
3、p::selection{}表示什么?
p::selection{}表示什么
表示p标签中被选中的内容,从而可以设置被选中内容的颜色
E::selection { sRules }
设置对象被选择时的样式。
4、E:after/E::after { sRules }如何使用?
E:after/E::after { sRules }如何使用
设置在对象后(依据对象树的逻辑结构)发生的内容。用来和content属性一起使用,并且必须定义content属性
5、伪类选择器中的单冒号和双冒号的区别和联系是什么?
CSS3将伪对象选择符(Pseudo-Element Selectors)前面的单个冒号(:)修改为双冒号(::)用以区别伪类选择符(Pseudo-Classes Selectors),但以前的写法仍然有效。
即E:after可转化为E::after
6、before和after有什么用(两种)?
不仅可以用新属性content添加内容,还可以添加样式,要配合content一起使用
二、css3中新增的伪类和伪元素有哪些
1、相关知识
2、代码
妙味css3课程---1-2、css3中新增的伪类和伪元素有哪些的更多相关文章
- 妙味css3课程---1-1、css中自定义属性可以用属性选择器么
妙味css3课程---1-1.css中自定义属性可以用属性选择器么 一.总结 一句话总结:可以的. 1.如何实现用属性选择器实现a标签根据href里面含有的字段选择背景图片? p a[href*=te ...
- ::before ::after CSS3中的伪类和伪元素
::before和::after伪元素的用法 一.介绍 css3为了区分伪类和伪元素,伪元素采用双冒号写法. 常见伪类——:hover,:link,:active,:target,:not(),:fo ...
- CSS3 动态生成内容(在Web中插入内容)====CSS的伪类或者伪元素
# css3 .类:伪类::伪元素 /* CSS3伪元素/伪类 :https://www.w3.org/TR/css3-selectors/#selectors ::selection 伪元素(F12 ...
- css3 -- 伪类与伪元素
伪类: 1.结构伪类 A:E : first-child{} E : nth-*(n){} E : first-*(even){} E : first-*(odd){} B:nth-child 是根 ...
- CSS3伪类和伪元素的特性和区别
前端er们大都或多或少地接触过CSS伪类和伪元素,比如最常见的:focus,:hover以及<a>标签的:link.visited等,伪元素较常见的比如:before.:after等. 其 ...
- CSS3伪类和伪元素
作为一个CSS3初学不久者来说,很容易混淆单冒号(:)和双冒号(::)的用法,以为两者可以互换着来使用.我自己之前也混淆过他们,因为两者看起来太相像了,就像孪生兄弟.但实际上,他们的区别还是挺大的,最 ...
- CSS3伪类和伪元素的特性和区别尤其是 ::after和::before
伪类和伪元素的理解 官方解释: 伪类一开始单单只是用来表示一些元素的动态状态,典型的就是链接的各个状态(LVHA).随后CSS2标准扩展了其概念范围,使其成为了所有逻辑上存在但在文档树中却无须标识的“ ...
- CSS3伪类与伪元素的区别及注意事项
CSS中伪类与伪元素的概念是很容易混淆的 今天就来谈谈伪类与伪元素之间的区别 定义 首先先来看看伪类与伪元素的定义 w3c中对于它们是这么解释的 伪类:用于向某些选择器添加特殊的效果 伪元素:用于将特 ...
- css3的伪(伪类和伪元素)大合集
本文讲css3的伪,不是讲它有多虚伪,而是说它的伪元素样式.不得不说以前虽知html伪元素,但很少用,后得知借助css3伪元素可以发挥极大的便利.故总结css3的伪如下: CSS中存在一些比较特殊的属 ...
随机推荐
- 05-数据类型转换(bool转换)
05-数据类型转换(bool转换)
- 【习题 8-18 UVA - 1619】Feel Good
[链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 用单调队列求出l[i]和r[i] 分别表示i的左边最近的大于a[i]的数的位置以及i右边最近的大于a[i]的数的位置. 则l[i]+ ...
- windows下laravel5安装
第一步:安装composer 网上教程非常多,自行百度 第二步:使用composer create-project laravel/laravel learnlaravel5 5.0.22 ...
- 赋值、复制构造函数和构造函数 & 异常安全的赋值
异常安全的赋值 需要注意,复制赋值和复制构造,相兼容. 赋值时候,要带上自检查.
- flash3D学习1
今天正式学习flash3D. 先配置: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0 ...
- 27.AngularJS 下载地址
转自:https://www.cnblogs.com/best/tag/Angular/ 各个 angular.js 版本下载: https://github.com/angular/angular. ...
- BZOJ 1503 treap
思路: treap (算是基本操作吧-..) 加减的操作数很少 就暴力好啦 每回判断一下最小的数是不是比M小 如果是 就删,继续判断 搞定. //By SiriusRen #include <c ...
- POJ 3276 枚举+差分?
题意: 思路: 先枚举一下k 贪心:如果当前是B那么就翻 差分一下序列 mod2 就OK了 //By SiriusRen #include <cstdio> #include <cs ...
- linux下支持托盘的邮件客户端Sylpheed
在网上搜索了很多客户端想支持系统托盘,发现一个很不错的邮件客户端Sylpheed.设置方式和foxmail很像,最为重要的是支持系统托盘,很方便,默认没有开启,简单设置下:配置->通用首选项-& ...
- FreeBSD是UNIX系统的重要分支,其命令与Linux大部分通用,少部分是其特有。
FreeBSD是UNIX系统的重要分支,其命令与Linux大部分通用,少部分是其特有. 1: man 在线查询 man ls2: ls 查看目录与档案 ls -la3: ln 建立链接文件 ln -f ...