:after/::after和:before/::before的异同
相同点
都可以用来表示伪类对象,用来设置对象前的内容
:before和::before写法是等效的; :after和::after写法是等效的
不同点
:before/:after是Css2的写法,::before/::after是Css3的写法
:before/:after 的兼容性要比::before/::after好 ,
不过在H5开发中建议使用::before/::after比较好
注意
这些伪元素 要配合content属性一起使用
这些伪元素 不会出现在DOM中,所以不能通过js来操作,仅仅是在 CSS 渲染层加入
这些伪元素 的特效通常要使用:hover伪类样式来激活
eg:当鼠标移在span上时,span前插入”111111”
<style>
span{
background: yellow;
}
span:hover::before{
content:"111111";
}
</style>
<span>222</span>
:after/::after和:before/::before的异同的更多相关文章
- Java 堆内存与栈内存异同(Java Heap Memory vs Stack Memory Difference)
--reference Java Heap Memory vs Stack Memory Difference 在数据结构中,堆和栈可以说是两种最基础的数据结构,而Java中的栈内存空间和堆内存空间有 ...
- Atitit 会话层和表示层的异同
Atitit 会话层和表示层的异同 会话层 这一层也称为会晤层或对话层.在会话层及以上的更高层次中,数据传送的单位没有另外再取名字,一般都可称为报文. 会话层虽然不参与具体的数据传输,但它却对数据传输 ...
- Linux知识:/root/.bashrc与/etc/profile的异同
Linux知识:/root/.bashrc与/etc/profile的异同 要搞清bashrc与profile的区别,首先要弄明白什么是交互式shell和非交互式shell,什么是login shel ...
- Shell 编程基础之 [ 与 [[ 的异同
一.简介 [ 与 test 等价,是 bash 的内部命令,GNU/linux 系统的 coreutils 软件包通常带 /usr/bin/test 和 /usr/bin/[ 命令.如果我们不用绝对路 ...
- php empty,isset,is_null比较(差异与异同)
php empty,isset,is_null比较(差异与异同) http://www.cnblogs.com/chengmo/archive/2010/10/18/1854258.html
- truncate,delete,drop的异同点
说明:本文摘自oracle技术用户讨论组 truncate,delete,drop的异同点 注意:这里说的delete是指不带where子句的delete语句 相同点:truncate和不带w ...
- 关于RPC与MQ异同的理解
最近看了一些资料,回顾过去项目的经验,梳理自己对两者异同的理解: 相同: 1.都利于大型系统的解耦: 2.都提供子系统之间的交互,特别是异构子系统(如java\node等不同开发语言): 不同: 1. ...
- OC 类方法,对象方法,构造方法以及instancetype和id的异同
OC 类方法,对象方法,构造方法以及instancetype和id的异同 类方法: 类方法是可以直接使用类的引用,不需要实例化就可以直接使用的方法.一般写一些工具方法. 类方法: 声明和实现的时候,以 ...
- java中的this和super的作用和异同和C++中调用父类的构造函数
来源于:http://www.cnblogs.com/hasse/p/5023392.html 这几天看到类在继承时会用到this和super,这里就做了一点总结,与各位共同交流,有错误请各位指正~ ...
- 图解call、apply、bind的异同及各种实战应用演示
一.图解call.apply.bind的异同 JavaScript中函数可以通过3种方法改变自己的this指向,它们是call.apply.bind.它们3个非常相似,但是也有区别.下面表格可以很直观 ...
随机推荐
- js获取当前时间:yyyy-MM-dd HH:MM:SS
var nowDate = new Date();var year = nowDate.getFullYear(); < ? ; ? " + nowDate.getDate() : n ...
- Call to undefined function Illuminate\Encryption\openssl_cipher_iv_length()
今天遇到一个错误,没有定义一个openssl_cipher_iv_length()方法,可是我明明开启OpenSSL了啊 如果开启了还报错 只需要把php的目录加入环境变量 -重启电脑 就解决了 但 ...
- 为什么CSS,JS以及图片等这些资源的路径需要加问号
我们平时练习的时候,很少写路径上面需要加问号的,而实际应用当中,我们经常看到一些资源的路径后面跟着问号,这是为什么呢? 答:答案很简单哦,其实就是为了防止缓存,我们可以在原本路径的后面加上问号,加上我 ...
- Bugku - 好多压缩包 - Writeup
bugku - 好多压缩包 - Writeup M4x原创,转载请注明出处 这道题前前后后做了好几天,这里记录一下 题目 文件下载 分析 解压下载后的文件,发现有68个压缩文件,并且每个压缩文件里都有 ...
- 基于语音识别、音文同步、图像OCR的字幕解决方案HtwMedia介绍
背景介绍 俗话说,“好记性不如乱笔头”,这充分说明了文字归档的重要性.如今随着微信.抖音等移动端app的使用越来越广,人们生产音.视频内容也越来越便捷.而相比语音和视频而言,文字具有易存档.易检索.易 ...
- JS高级---案例贪吃蛇,把封装的函数移动到js文件中
案例贪吃蛇,把封装的函数移动到js文件中 <!DOCTYPE html> <html lang="en"> <head> <meta ch ...
- 7_2 最大乘积(UVa11059)<枚举连续子序列>
给一个数字集合{ S1,S2,…,Sn },请从这个数字集合里找出一段连续数字,使他们的乘积是最大的.以Case 1为例子,2 x 4 = 8为这个集合的最大乘积:而Case 2则为2 x 5 x(– ...
- jsp+servlet实现的验证登陆
可以将业务逻辑处理和视图相分离,使用jsp界面表示视图,使用servlet处理业务逻辑 login.jsp <%@ page language="java" contentT ...
- P & R 10
作为一个后端设计者,所需要掌握的技能其实就是熟练的利用工具,为自己服务. 需要的知识是什么?说的简单点,就是如何把设计的PPA搞上去. 说的复杂点,那就得从PPA需要注意的每个点去一一剖析.这个就太需 ...
- 分段函数&数学函数
本题要求计算下列分段函数f(x)的值(x为从键盘输入的一个任意实数): 输入格式: 直接输入一个实数x 输出格式: 在一行中按“f(x)=result”的格式输出,其中x与result都保留三位小数. ...