.cf:after,.cf:before {content: " "; display: table;}

.cf:after {clear: both;}
:before是因为table类型能生成独立的bfc,防止上边距塌陷,
:after负责清除浮动,防止父级高度塌陷;配合使用,代码少,效率高。

css 中的伪类选择器before 与after的更多相关文章

  1. CSS属性、伪类选择器,CSS3选择器

    CSS1时IE6是部分支持,伟大的IE6!CSS2时IE6部分支持,伟大的IE6依旧是部分支持!CCS3盛行CSS4也已经提上日程的现在,IE6完全不支持.IE6你该走了,我们会永远记住你的功绩的!I ...

  2. CSS3中的伪类选择器详解

      类选择器和伪类选择器区别 类选择器我们可以随意起名,而伪类选择器是CSS中已经定义好的选择器,不可以随意起名. 伪类选择器以及伪元素 我们把它放到这里 p.aaas{ text-align: le ...

  3. CSS中的伪类与伪元素

    在前端开发中,大家或多或少的有接触过CSS伪类和伪元素,使用伪元素的时候,总感觉和伪类很相似,但又不能详细的说出两者的区别和联系,那么两者到底有什么区别和联系呢? 在 W3C 中定义: 伪类:用于向某 ...

  4. 转:vw适配中使用伪类选择器遇到的问题

    地址:https://blog.csdn.net/perryliu6/article/details/80965734 在使用vue init webpack构建的项目中,一开始我准备使用rem布局, ...

  5. CSS选择器之伪类选择器(元素)

    :first-child 选择某个元素的第一个子元素(IE6不支持) :last-child 选择某个元素的最后一个子元素 :first-of-type [CSS3]选择一个上级元素下的第一个同类子元 ...

  6. CSS基础 结构伪类选择器 last-child、first-child和nth-of-type的使用方法

    一.通过伪类选择器查找单个标签元素html结构 <div> <a herf='#'>导航1</a> <a herf='#'>导航2</a> ...

  7. css伪选择器使用总结——css中关于伪类和伪元素的知识总汇

    CSS 伪类用于向某些选择器添加特殊的效果,而CSS引入伪类和伪元素的概念是为了实现基于文档树之外的信息的格式化.这里讲总结关于css伪类和伪元素的相关使用 伪元素 :before/:before 在 ...

  8. CSS选择器之伪类选择器(伪元素)

    selection [CSS4]应用于文档中被用户高亮的部分(比如使用鼠标或其他选择设备选中的部分).(IE8及以下不支持)(火狐-moz-selection) first-line 选择每个 < ...

  9. CSS选择器之伪类选择器(交互)

    :link 选取未访问链接 :active 选取活动链接(单击某链接,未松开鼠标时). :visited 选取已被访问的链接. :target 链接指定的目标 :hover 当鼠标浮在元素上方时. : ...

随机推荐

  1. 易语言报错:无法定位链接器!请检查 tools\link.ini 中的配置是否正确。 静态连接失败

    今天下午搞易语言,在编写动态链接库以后,静态编译的时候出现以下提示: 无法定位链接器!请检查 tools\link.ini 中的配置是否正确. 静态连接失败 于是网上百度了下,找到相关的解决方法: 编 ...

  2. oracle 连接数据库以及查看当前用户、当前数据库实例

    sql>show user;查看当前用户 sql>show parameter instance_name;查看当前数据库实例 例如: sqlplus登录:用sys用户登录(密码是1234 ...

  3. Laravel 5.1 报错:[App\Http\Requests\Request] is not instantiable

    Laravel 5.1 报错:[App\Http\Requests\Request] is not instantiable 错误提示: Whoops, looks like something we ...

  4. Laravel 之Artisan

    简介: Artisan是Laravel中自带的命令行工具的名称: 由强大的Symfony Console组件驱动的: 提供了一些对应用开发有帮助的命令: 查看所有可用的Artisan的命令 php a ...

  5. 洛谷 P2613 【模板】有理数取余

    P2613 [模板]有理数取余 题目描述 给出一个有理数c=\frac{a}{b}c=ba​,求c\ \bmod 19260817c mod19260817的值. 输入输出格式 输入格式: 一共两行. ...

  6. 数字巨头们的表态--<大佬与大话>

    作者魏武挥 类别非虚构 / 中篇 本书为作者为<21世纪商业评论>的专栏文章合集,共20篇,算是第一卷吧,后期还会写下去.这个专栏的名字叫<大佬与大话>,专门收集TMT圈子商业 ...

  7. docker 配置 direct-lvm

    当前需要设置的宿主机是环境是搭建在vbox虚拟机上的centos7系统.测试环境中出现过一次意外情况,当时为了测试docker日志文件限制,运行了一个docker容器,但是后面忘记停止了,几天后发现了 ...

  8. how to avoid over-fitting?(机器学习中防止过拟合的方法,重要)

    methods to avoid overfitting: Cross-Validation : Cross Validation in its simplest form is a one roun ...

  9. BUPT复试专题—最近公共祖先(2014软院)

    题目描述 给出一棵有N个节点的有根树TREE(根的编号为1),对于每组查询,请输出树上节点u和v的最近公共祖先. 最近公共祖先:对于有向树TREE的两个结点u,v.最近公共祖先LCA(TREE u,v ...

  10. sshd登录攻击

    先说简单的防范措施: 1.密码足够复杂 密码的长度大于8位.有数字.大小写字母.特殊字符组合. 2.nmap 扫描 为了避免被扫描到, #看到端口是81 ssh root@192.168.1.63 玩 ...