伪类after、before的使用

::before//伪元素　　:hover//伪类

#all::after{

　　display:table;

　　clear:both;

　　content:"";

}

#all::after:在all里面的最后添加一个虚拟的子元素after

a:hover:带伪类别的a标签

外部容器出现塌陷现象（伪类after、before的使用）的更多相关文章

  1. CSS伪类整理笔记

    0 伪元素 虚拟的一个元素,用于向已有的元素添加特殊效果,可用标签元素实现该效果. css3中规定:伪元素的由两个冒号::开头,然后是伪元素的名称.用两个冒号::是为了区别伪类和伪元素(CSS2中并没 ...

  2. CSS3伪类和伪元素的特性和区别尤其是 ::after和::before

    伪类和伪元素的理解 官方解释: 伪类一开始单单只是用来表示一些元素的动态状态,典型的就是链接的各个状态(LVHA).随后CSS2标准扩展了其概念范围,使其成为了所有逻辑上存在但在文档树中却无须标识的“ ...

  3. css中伪类和伪元素的区别

    转载:http://www.cnblogs.com/ihardcoder/p/5294927.html CSS3伪类和伪元素的特性和区别   前端er们大都或多或少地接触过CSS伪类和伪元素,比如最常 ...

  4. 用CSS伪类实现毛玻璃效果

    效果图: 思路: 内容容器需要一个before伪类,负责引用跟背景容器相同的背景图,还需要一个after伪类,用来加上半透明的白色背景.这两个伪类的层级需都为-1,而内容容器本身的层级为1,这样做可以 ...

  5. HTML+CSS教程（五）外联样式、组选择器、圆角边框、样式优先级、伪类、盒子模型、元素溢出

    一.外联样式 通过link标签引入外部css文件夹中的xxx.css文件到head标签中 例: 二. 1.组选择器 选择器名称1,选择器名称2,选择器名称3,…{属性:属性值;属性;属性值} 例: & ...

  6. 2、前端--初见前后端交互、CSS简介、基本选择器、组合选择器、属性选择器、分组与嵌套、伪类选择器

    今日内容概要 初窥后端框架 css简介 css选择器 今日内容详细 初次体验前后端交互 # 代码无需掌握 只看效果即可 """后端框架:可以简单的理解为别人写好的一个非常 ...

  7. 谈谈一些有趣的CSS题目（十）-- 结构性伪类选择器

    开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...

  8. CSS3 nth 伪类选择器

    考察下面的 HTML 代码片段: <div> <section>section 1</section> <section>section 2</s ...

  9. CSS权威指南之css声明，伪类，文本处理--(简要笔记一)

    1.css层叠的含义 后面的会覆盖前面的样式 2.每个元素生成一个框,也称盒.   3.替换元素和非替换元素. img如果不指定src的外部路径,该元素就没有意义.他由文档本身之外的一个图像文件来替换 ...

随机推荐

  1. c#实现内存映射文件共享内存

    原文:http://blog.csdn.net/wangtiewei/article/details/51112668 内存映射文件是利用虚拟内存把文件映射到进程的地址空间中去,在此之后进程操作文件, ...

  2. Git『Everything up-to-date』问题解决

    今天提交代码的时候遇到了一个小问题,这里解决了记下小记. 提交代码遇到『Everything up-to-date』 上网查了下,发现中文大多答非所问,少数能解决的并没有阐述原理,所以我写这篇文章记录 ...

  3. asp.net(C#)常用时间日期处理类

    using System; using System.Data; using System.Configuration; using System.Web; using System.Web.Secu ...

  4. shell_script1

    1.简介 2.read 3.运算工具 4.if/then结构 5.while循环 6.for循环   一.简介 1.什么是shell shell是用户与系统交互作用的界面.shell是一种命令解释程序 ...

  5. 2.CSS使用基础(1)

    目录 一.css颜色的四种表示法 二.使用css 4种方式 三.css注释: 四.CSS Id 和 Class选择器 五.多重样式优先级顺序 六.CSS Backgrounds(背景) 七.CSS T ...

  6. vuejs code splitting with webpack 3种模式

    我们知道一个web app如果太大会严重影响用户的体验,如何能够最快速度地让用户看到完整页面是优化web应用需要做的重要工作. 这其中使用code split实现lazy加载,只让用户初次访问时只加载 ...

  7. 如何使用 Jenkins、GitHub 和 Docker 在 Azure 中的 Linux VM 上创建开发基础结构

    若要将应用程序开发的生成和测试阶段自动化,可以使用持续集成和部署 (CI/CD) 管道. 本教程介绍如何在 Azure VM 上创建 CI/CD 管道,包括如何: 创建 Jenkins VM 安装并配 ...

  8. Vue2学习笔记:键盘事件

    Vue2键盘事件:keydown/keyup... 1.使用 <!DOCTYPE html> <html> <head> <title></tit ...

  9. golang 防知乎 中文验证码 源码

    原创,转载请注明出处! 最开始用图形来模仿文字进行各种角度的倒立和排列,后来切换为文字后,有很多问题.总结如下: 1.程序在画图形和画文字方面不一样,图形的是从原点开始(0,0),而文字则从文字的基线 ...

  10. Linux 系统的/usr目录

    /usr不是user的缩写,其实usr是Unix Software Resource的缩写, 也就是Unix操作系统软件资源所放置的目录,而不是用户的数据:所有系统默认的软件都会放置到/usr, 系统 ...