.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. 【SPOJ1825】Free tour II （点分治，启发式）

    题意: 边权可能为负 思路: 感觉我自己写的还是太过僵硬了,可以灵活一点,比如可以多写几个不同的dfs求出不同的信息,而不是压到同一个dfs里 #include<cstdio> #incl ...

  2. 【Hihocoder1034】毁灭者问题（splay，树状数组）

    题意: 假设你拥有 n 个魔法单位,他们从左到有站在一行,编号从 1 到 n. 每个单位拥有三项属性: si: 初始法力. mi: 最大法力上限. ri: 每秒中法力回复速度. 现在你操纵一个毁灭者, ...

  3. android 布局之LinearLayout（学习一）

    一,View localView = mRadioGroup_content.getChildAt(i);指定自定义菜单栏的点击格,如child3 其中:mRadioGroup_content = ( ...

  4. jqeury设置元素屏幕居中

    jQuery.fn.center = function () { this.css(“position”,”absolute”); this.css(“top”, ( $(window).height ...

  5. mysql 5.7版本目录无data文件夹的解决办法

    安装mysql 5.7+版本时,若发现因根目录下,缺少data文件夹的情况, ***请不要去拷贝其他版本的data文件夹!*** 因为此操作会出现很多潜在问题:比如我遇到的执行show variabl ...

  6. 【Linux学习笔记】栈与函数调用惯例

    栈与函数调用惯例(又称调用约定)— 基础篇 记得一年半前参加百度的校招面试时,被问到函数调用惯例的问题.当时只是懂个大概,比如常见函数调用约定类型及对应的参数入栈顺序等.最近看书过程中,重新回顾了这些 ...

  7. 用C++实现约瑟夫环的问题

    约瑟夫问题是个有名的问题:N个人围成一圈.从第一个開始报数,第M个将被杀掉,最后剩下一个,其余人都将被杀掉. 比如N=6,M=5.被杀掉的人的序号为5,4,6.2.3.最后剩下1号. 假定在圈子里前K ...

  8. 79.iOS 设备的UI规范和iOS各控件默认高度

    iOS设备的UI 规范 iPhone界面尺寸 iPhone图标尺寸 iPad的设计尺寸 iPad图标尺寸 iPhone设备尺寸分辨率比例 iPhone各设备 launch image iOS 各种控件 ...

  9. Solidworks 不能生成实体，因为这将导致厚度为零的零件怎么办

    如下图所示,我认为我长出一块东西根本不会对其他零件有什么影响.   去掉合并结果之后就好了.   钣金要比方钢高出1mm,这样焊接上去才方便.              

  10. linux操作系统下查看某rpm包是32bit 还是x64bit的命令

    [root@hosta ~]# rpm -qa --queryformat "%{NAME}-%{VERSION}-%{RELEASE} (%{ARCH})\n" | grep l ...