1. 伪元素:(css3中将所有伪元素前变成了两个冒号,即::first-letter、::first-line、::before、::after、::selection。目的是为了区分伪元素与伪类。对于IE6~IE8,仅支持单冒号写法)
    1.::first-letter  :用来选择文本块的第一个首字母。
    2.::first-line :用来匹配元素的第一行文本。
    3.::befor 和 ::after :创建一个作为当前元素子元素的伪元素。常通过 content 属性来为一个元素添加修饰性的内容。 此元素默认为行内元素。:before和:after伪元素指定了位于一个元素的文档树内容之前和之后的内容的位置。
     a. :before和:after伪元素会从文档树中它们附着的元素上继承所有可继承的属性。不可继承的属性,属性值为初始值。
     b. :before和:after伪元素会与其它盒相互影响,就像它们是插在其相关元素里的真实元素一样。  
       c. 本规范并没有完整定义:before和:after伪元素对可替换元素(例如HTML中的IMG)的相互影响。这会在将来的规范中详细定义。(这里的规范指CSS2.1)。
       d. 下方的代码,使用伪元素清除浮动。(这里有个问题是,为什么要设置visibility、font-size、height、zoom这几个属性。我在chrome浏览器下去掉这几个属性后,仍然清除了浮动)

    .clearfix:after {
    visibility:hidden;
    display:block;
    font-size:0;
    content:" ";
    clear:both;
    height:0;
    }
    .clearfix {
    zoom:1;
    }

      

         
    4. ::selection :用来匹配突出显示的文本(被选中的文本)。该伪元素仅接受两个属性:background与color。仅IE9支持,FF需加上-moz前缀,webkit内核浏览器支持。

css伪类选择器详细解析及案例使用-----伪元素的更多相关文章

  1. css伪类选择器详细解析及案例使用-----伪类选择器(1)

    动态伪类选择器:E:link :选择匹配的E元素,并且匹配元素被定义了超链接并未被访问过.E:visited :选择匹配的E元素,而且匹配的元素被定义了连接并已被访问过.E:active :选择匹配的 ...

  2. css伪类选择器详细解析及案例使用-----伪类选择器(2)

    结构伪类选择器: <div> <ul> /*ul:only-of-type*/ <li>one</li> /*li:first-child li:nth ...

  3. css伪类选择器及伪元素选择器

    1.类选择器 在css中可以使用类选择器把相同的元素定义成不同的样式.比如: 结果如下: 标题背景未变 2.伪类选择器 类选择器和伪类选择器的区别在于,类选择器我们定义的,而伪类选择器是CSS中已经定 ...

  4. CSS动态伪类选择器温故-3

    动态伪类选择器 伪类选择器:大家熟悉的:[:link][:visited][:hover][:active]CSS3的伪类选择器分为六种:(1)动态伪类选择器(2)目标伪类选择器(3)语言伪类选择器( ...

  5. 关于CSS伪类选择器

    #CSS伪类选择器 ##使用css伪类选择器需要注意的 使用css的伪类选择器来选择某元素时,需要特别注意 :first-child 和 :nth-child(n) 等时, 网页渲染是从语句的后面开始 ...

  6. CSS动态伪类选择器温故

    动态伪类选择器 伪类选择器:大家熟悉的:[:link][:visited][:hover][:active]CSS3的伪类选择器分为六种:(1)动态伪类选择器(2)目标伪类选择器(3)语言伪类选择器( ...

  7. CSS3 选择器——笔记+实战案例(基本选择器、组合选择器、属性选择器、伪类选择器)

    使用CSS3 选择器——笔记 CSS通过选择器控制HTML元素,CSS选择器对网页对象可以实现一对一.一对多或者多对一的匹配. 一.CSS3选择器分类 CSS选择器在CSS2.1选择器的基础上新增了属 ...

  8. CSS魔法堂:稍稍深入伪类选择器

    前言  过去零零星星地了解和使用:link.::after和content等伪类.伪元素选择器,最近看书时发现这方面有所欠缺,于是决定稍微深入学习一下,以下为伪类部分的整理. 伪类  伪类选择器实质上 ...

  9. CSS3新增的伪类选择器

    伪类选择器的作用:对已有选择器做进一步的限制,对已有选择器能匹配的元素做进一步的过滤.CSS 3提供的伪类选择器主要分为以下三类: 结构性伪类选择器 UI元素状态伪类选择器 其他伪类选择器 1.结构性 ...

随机推荐

  1. Web应用程序项目XXXX已配置为使用IIS。无法访问IIS元数据库。您没有足够的特权访问计算机上的IIS网站

    问题:Windows8下直接使用VS打开项目,出现问题:XXXX已配置为使用IIS.无法访问IIS元数据库.您没有足够的特权访问计算机上的IIS网站.解决:1.以“管理员权限”运行VS,在VS菜单打开 ...

  2. css伪类选择器详细解析及案例使用-----伪类选择器(2)

    结构伪类选择器: <div> <ul> /*ul:only-of-type*/ <li>one</li> /*li:first-child li:nth ...

  3. ASP.Net动态创建GridView

    1.创建Field BoundField requestitem = new BoundField();//注意Field可以是ButtonField,TemplateField,...等等GridV ...

  4. h5connect.js 腾讯云视频点播使用指南

    http://video.qcloud.com/download/docs/QVOD_Player_Web_SDK_Developer_Guide.pdf 腾讯云视频点播服务 Web播放器SDK开发指 ...

  5. 使用PHP解压文件Unzip

    这是一个非常方便的PHP函数从.zip文件解压缩文件.它有两个参数:第一个是压缩文件的路径和第二 function unzip_file($file, $destination) { // creat ...

  6. flask开发restful api系列(5)-短信验证码

    我们现在开发app,注册用户的时候,不再像web一样,发送到个人邮箱了,毕竟个人邮箱在移动端填写验证都很麻烦,一般都采用短信验证码的方式.今天我们就讲讲这方面的内容. 首先,先找一个平台吧.我们公司找 ...

  7. Factorial Solved Problem code: FCTRL

    import sys #import psyco #很奇怪,这题用psyco就runtime error #psyco.full() def z(n): #这个应该是技巧的一种算法 r = 0 whi ...

  8. NOR flash和NAND flash区别,RAM 和ROM区别

    ROM和RAM指的都是半导体存储器,ROM是Read Only Memory的缩写,RAM是Random Access Memory的缩写.ROM在系统停止供电的时候仍然可以保持数据,而RAM通常都是 ...

  9. WPF学习拾遗(二)TextBlock换行

    原文:WPF学习拾遗(二)TextBlock换行 下午在帮组里的同事解决一个小问题,为了以后方便,把就把它收集一下吧. 新建一个TextBlock作为最基础的一个控件,他所携带的功能相对于其他的控件要 ...

  10. Html.DropDownList的用法

    直接上代码 页面代码 <td> <%= Html.DropDownList("selCity") %> </td> controller里面的代 ...