通常hover后面跟的选择器,都是在myClass结构之下 的dom元素。

如果想在myClass下添加after等,就需要两个::号。

注:after/before是属于myclass的下级元素,并不是同级

.myClass:hover::after{

  content: '';
display: block;
background: url(../images/category_icon/forbid_red.png) no-repeat 14px 15px;
height: 30px;
width: 30px;
background-size: 15px;
}

关于hover和after、before合用的更多相关文章

  1. chrome控制台模拟hover、focus、active等状态,方便调试

    有时候需要调试一个网页,需要某些元素在hover.focus.active等状态. 比如hover,鼠标放到hover上,然后去控制台中找DOM,鼠标移开的时候元素就不是hover状态了. 此时可以使 ...

  2. CSS调试小技巧 —— 调试DOM元素hover,focus,actived的样式

    最近学习html5和一些UI框架,接触css比较多,就来跟大家分享一下css中的一些调试技巧.之前做页面,css都是自己写的,所以要改哪里可以很快的找到,现在使用了UI框架,里面的样式是不可能读完的, ...

  3. 转载利用伪元素单个颜色实现 hover 和 active 时的明暗变化效果

    1.颜色小tip知识 在背景色上方叠加一个黑色半透明层 rgba(0,0,0,.2) 可以得到一个更暗的颜色 在背景色上方叠加一个白色半透明层 rgba(255,255,255,.2) 可以得到一个更 ...

  4. 多行图片hover加边框兼容IE7+

    问题: 遇到多行多列排列的图片时,hover上去加边框会把下面的图片挤到别处 ============================================================ ...

  5. jQuery中多个元素的Hover事件

    1.需求简介 jQuery的hover事件只是针对单个HTML元素,例如: $('#login').hover(fun2, fun2); 当鼠标进入#login元素时调用fun1函数,离开时则调用fu ...

  6. JS实现类似QQ好友头像hover时显示资料卡的效果

    一.应用场景 鼠标hover弹出div,并且鼠标离开后不能马上隐藏,因为这个div上还有功能入口.比如: 鼠标经过好友列表中的好友头像时显示资料卡的效果 hover时显示二维码 二.实现 用如下这样一 ...

  7. 在CSS中定义a:link、a:visited、a:hover、a:active顺序

    摘自:http://blog.snsgou.com/post-2.html     以前用CSS一直没有遇到过这个问题,在最近给一个本科同学做的项目里面.出现一些问题,搜索引擎查了一些网站和资料,发现 ...

  8. Css-深入学习之单个颜色实现 hover 和 active 时的明暗变化效果

    本文是作者从别的网站和文章学习了解的知识,简单做了个笔记,想要学习更多的可以参考这里:[css进阶]伪元素的妙用--单标签之美,奇思妙想 (1.normal)(2.hover)(3.active) / ...

  9. css实现了hover显示title的效果

    <div data-title="hello, world">hello...</div> <style> div { position: re ...

随机推荐

  1. linux下将指定目录加入环境变量的方法

    每个用户目录下都有一个对应的.bash_profile比如root用户对应/root/.bash_profile,普通用户cqh对应/home/cqh/.bash_profile,以root用户为例v ...

  2. JavaWeb学习 (二十七)————监听器(Listener)在开发中的应用

    监听器在JavaWeb开发中用得比较多,下面说一下监听器(Listener)在开发中的常见应用 一.统计当前在线人数 在JavaWeb应用开发中,有时候我们需要统计当前在线的用户数,此时就可以使用监听 ...

  3. Jenkins持续集成学习-Windows环境进行.Net开发4

    目录 Jenkins持续集成学习-Windows环境进行.Net开发4 目录 前言 目标 Github持续集成 提交代码到Github 从Github更新代码 git上显示构建状态 自动触发构建 Gi ...

  4. git入门(廖雪峰老师)

    根据廖雪峰老师的git教程进行学习总结: 1.之前上班用的都是svn进行管理,那么svn和git有什么区别呢? svn是集中式的版本控制系统,而git是分布式版本控制系统,那么集中式和分布式版本控制系 ...

  5. 《SQL Server从入门到精通》

    书名 <SQL Server从入门到精通> 图片 时间 2017-6月 学习 书还可以看完不痛不痒 光盘里面是c的视频有趣这是要我学c的节奏啊,可以写一些基础sql语句也是一门语言叫T-s ...

  6. EXISTS 执行顺序

    select * from a where a.s_status=1 and exists (select orderid from b where a.orderid=b.orderid) exis ...

  7. hadoop fs,hadoop dfs,hdfs dfs

    hadoop fs: FS relates to a generic file system which can point to any file systems like local, HDFS ...

  8. Spark集群的任务提交执行流程

    本文转自:https://www.linuxidc.com/Linux/2018-02/150886.htm 一.Spark on Standalone 1.spark集群启动后,Worker向Mas ...

  9. 2018-02-06 编程猫IDE体验:对Scratch的改进

    前两天偶遇编程猫推介(为什么没有中文的编程?), 第一眼感觉像Scratch, 求证之下确实, 并且据说有改良. 今天非常粗浅地尝试一下, 限于水平没有做出很炫的效果, 不过颇有些发现. 首先上最终效 ...

  10. 测试思想-集成测试 关于接口测试 Part1

    关于接口测试 by:授客 QQ:1033553122 接口定义 接口泛指实体把自己提供给外界的一种抽象化物,用以由内部操作分离出外部沟通方法,使其能被修改内部而不影响外界其他实体与其交互的方式. 举例 ...