一、总结:

::before是在标签内容前面添加内容, ::after是在标签内容后面添加内容

::before ::after与:before  :after的区别:css3中修订后的伪元素使用::两个冒号,使用单冒号和双冒号的功能还是一样,IE8只支持单冒号的伪元素,所以使用单冒号的最安全。

关于伪元素和伪类(选择器):

伪元素:

伪类选择器:

二、实例:

表单没有添加冒号的情况:

1. :before

2. :after

css之伪类选择器:before :after(::before ::after)的更多相关文章

  1. css hover伪类选择器与JQuery hover()方法

    css hover伪类选择器 它属于anchor伪类 在支持 CSS 的浏览器中,<a>标签链接的不同状态都可以以不同的方式显示,常常用来改链接的颜色效果 实例 a:link {color ...

  2. css的伪类选择器的使用

    伪类选择器,在不同情况下显示的css,伪类选择器在处理页面的美观是很大帮助.其实很多美丽的按钮或者页面都是有这些基础的知识实现的,掌握好基础很重要. 名字 实例 说明 :link a:link 选择所 ...

  3. HTML&CSS基础-伪类选择器

    HTML&CSS基础-伪类选择器 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.html源代码 <!DOCTYPE html> <html> & ...

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

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

  5. CSS中伪类选择器及伪元素

    1.伪类选择器 在CSS中,最常用的伪类选择器是使用在a(锚)元素上的几种选择器,它们的使用方法如下: a:link{color:#FF0000;text-decoration:none} a:vis ...

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

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

  7. 前端开发HTML&css入门——伪类选择器和一些特殊的选择器

    伪类和伪元素 有时候,你需要选择本身没有标签,但是仍然易于识别的网页部位,比如段落首行或鼠标滑过的连接.CSS为他们提供一些选择器:伪类和伪元素. 常用的一些伪类选择器: :link :visited ...

  8. 关于CSS伪类选择器

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

  9. CSS伪类选择器和伪元素选择器

    CSS的伪类选择器常用的是link/visited/hover/active,分别对应未访问.已访问过.鼠标悬停.鼠标按下时的样式,常用于链接,使用时要按此顺序依次写CSS,不能乱 a:link{ba ...

随机推荐

  1. sql语句 优化技巧

    1.应尽量避免在 where 子句中使用!=或<>操作符,否则将引擎放弃使用索引而进行全表扫描. 2.对查询进行优化,应尽量避免全表扫描,首先应考虑在 where 及 order by 涉 ...

  2. localhost 和 127.0.0.1 的区别

    很多人会接触到这个ip地址127.0.0.1.也许你会问127.0.0.1是什么地址?其实127.0.0.1是一个回送地址,指本地机,一般用来测试使用.大家常用来ping 127.0.0.1来看本地i ...

  3. Sobel边缘检测算法(转载)

    转载请注明出处:  http://blog.csdn.net/tianhai110 索贝尔算子(Sobel operator)主要用作边缘检测,在技术上,它是一离散性差分算子,用来运算图像亮度函数的灰 ...

  4. 递归神经网络(RNN,Recurrent Neural Networks)和反向传播的指南 A guide to recurrent neural networks and backpropagation(转载)

    摘要 这篇文章提供了一个关于递归神经网络中某些概念的指南.与前馈网络不同,RNN可能非常敏感,并且适合于过去的输入(be adapted to past inputs).反向传播学习(backprop ...

  5. 147. Insertion Sort List

    Sort a linked list using insertion sort. 代码如下: /** * Definition for singly-linked list. * public cla ...

  6. 瓜娃《guava》api快速入门

    1,大纲 让我们来熟悉瓜娃,并体验下它的一些API,分成如下几个部分: Introduction Guava Collection API Guava Basic Utilities IO API C ...

  7. UVa 699 下落的树叶

    https://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&page=show_problem& ...

  8. cloudera安装报错 socket.gaierror: [Errno -2] Name or service not known

    有时候安装cloudera会报socket.gaierror: [Errno -2] Name or service not known,或者服务器可能IP或mac地址冲突会引发次错误.导致机器服务不 ...

  9. 局域网络ping不通

    描述:今天和老崔.老周去公司的新办公地点//相比临时的,十分高大上.当我们把两台台式电脑A.B装好了,网络设置也陪好了,确认能够上网,再装打印机的时候,发现搜索不到打印机的ip(打印机也是有自己的IP ...

  10. P364 实战练习(多线程)

    尝试定义一个继承Thread类的类,并覆盖run( )方法,在run( )方法中每隔1000毫秒打印一句话. 编写代码如下: 编写PractiseThread类: package org.hanqi. ...