css里面的伪元素主要是用来给选择器设置特殊效果。根据常用性,记录before和after。 “:before”伪元素用来在元素的内容前面添加新的元素。比如标题前面会有一个小方块,就可以通过‘ :before ’来添加。

.title:before{
content:'';
height:30px;
width:4px;
background:#eee;
}

同理,‘ :after ’就是在元素的内容后面添加新元素。

css伪元素之before和after的更多相关文章

  1. jQuery如何改变css伪元素样式

    首先我们看一下css伪元素是什么: CSS 伪元素用于向某些选择器设置特殊效果. 伪元素有哪些: :first-line 伪元素:"first-line" 伪元素用于向文本的首行设 ...

  2. css 伪元素分享!!!

    最近接触到的css 伪元素觉得还算不错 分享下: 1.清楚内盒浮动设置: ;} .back_list ul:after{;visibility: hidden;}/*清楚内盒浮动设置*/ 2.伪元素a ...

  3. CSS伪类与CSS伪元素的区别及由来

    关于两者的区别,其实是很古老的问题.但是时至今日,由于各种网络误传以及一些不负责任的书籍误笔,仍然有相当多的人将伪类与伪元素混为一谈,甚至不乏很多CSS老手.早些年刚入行的时候,我自己也被深深误导,因 ...

  4. (六)CSS伪元素

    CSS伪元素用于向某些选择器设置特殊效果. 伪元素的用法和伪类相似: selector:pseudo-element {property:value;} CSS类也可以与伪元素配合使用: select ...

  5. CSS 伪元素

    CSS伪元素是用来添加一些选择器的特殊效果. 语法 伪元素的语法: selector:pseudo-element {property:value;} CSS类也可以使用伪元素: selector.c ...

  6. css伪元素

    CSS 伪元素用于向某些选择器设置特殊效果. 1.:first-line 伪元素  "first-line" 伪元素用于向文本的首行设置特殊样式.注意:"first-li ...

  7. js如何控制css伪元素内容(before,after)

    曾经遇到的问题,在对抗UC浏览器屏蔽需要把内容输出到css 伪元素中输出.有个疑问如何用js控制它.于是在segmentfault提问,如下是对问题的整理: 如何用js控制css伪类after 简单粗 ...

  8. css伪元素用法大全

    本文主要讲解css伪元素的用法,有需要的朋友可以阅读此文.本文讲解的伪元素有:before,after. 什么是伪元素(Pseudo element)? 伪元素不是真正的元素,不存在与文档之中,所以j ...

  9. js分析 汽_车_之_家 js生成css伪元素 hs_kw44_configUS::before

    0.参考 https://developer.mozilla.org/zh-CN/docs/Web/CSS/Pseudo-elements https://developer.mozilla.org/ ...

  10. CSS伪元素before、after妙用

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. 猜数字游戏,判断输入的数字与系统产生的数字是否一致(Math.random()与if嵌套循环)

    package com.summer.cn; import java.util.Scanner; public class Test041509 { /** * java 随机数 Math * Mat ...

  2. 工具 Windows安装Anaconda

    下载 https://mirrors.tuna.tsinghua.edu.cn/anaconda/archive/ 安装 1.勾选添加Anaconda到PATH环境变量 2.配置清华镜像 conda ...

  3. 【LOJ 3049】「十二省联考 2019」字符串问题

    这个D1T2绝对有毒... 首先我们构造一把反串的后缀自动机. 然后我们就需要找到每一个子串在SAM上的节点. 这个可以通过扫描线+树上倍增处理. 首先我们把所有的子串按照左端点排序, 然后从右往左扫 ...

  4. 洛谷 P1451 求细胞数量

    题目链接 https://www.luogu.org/problemnew/show/P1451 题目描述 一矩形阵列由数字0到9组成,数字1到9代表细胞,细胞的定义为沿细胞数字上下左右若还是细胞数字 ...

  5. 【redis】1.redis-windows安装+配置介绍

    1.下载windows版本redis 官方下载地址:http://redis.io/download,不过官方没有64位的Windows下的可执行程序,目前有个开源的托管在github上, 地址:ht ...

  6. a2dp播放流程源码分析

    之前分析了a2dp profile 的初始化的流程,这篇文章分析一下,音频流在bluedroid中的处理流程. 上层的音频接口是调用a2dp hal 里面的接口来进行命令以及数据的发送的. 关于控制通 ...

  7. Django ORM模型:想说爱你不容易

    作者:Vamei 出处:http://www.cnblogs.com/vamei 严禁转载. 使用Python的Django模型的话,一般都会用它自带的ORM(Object-relational ma ...

  8. SSH(poderosa)を使って、さくらのMySQLサーバーに接続する方法

    SSH(poderosa)を使って.さくらのMySQLサーバーに接続する方法の覚書. 現在のさくらサーバーでは.新規ユーザーはTELNETが使えない.なので.データベースをコマンドラインで操作するには ...

  9. GitHub上README.md编写教程(基本语法)

    一.标题写法: 第一种方法: 1.在文本下面加上 等于号 = ,那么上方的文本就变成了大标题.等于号的个数无限制,但一定要大于0个哦.. 2.在文本下面加上 下划线 - ,那么上方的文本就变成了中标题 ...

  10. 使用log4j记录日志

    目录 log4j的优点 导入log4j的jar包 log4j的错误级别 log4j日志的输出目的地 log4j的配置示例 log4j的全局配置讲解 控制台日志的配置讲解 日志输出文件的配置讲解 使用l ...