css 伪元素分享!!!

最近接触到的css 伪元素觉得还算不错 分享下:

1、清楚内盒浮动设置:

.back_list ul{padding:12px 0 0 12px;zoom:1;}
.back_list ul:after{clear: both;content: ".";display: block;height: 0;visibility: hidden;}/*清楚内盒浮动设置*/

 

2、伪元素after设置,在元素之后添加内容

.afterxx{width:400px;height:200px; background-color:#999;border-radius:10px;margin:50px;position:relative;}
.afterxx:after{color:#999;font-size:94px;content:"◀";position:absolute;left:-23px;top:16%;}

 

3、伪元素before设置,在元素之前添加内容

.beforexx{width:300px;height:100px;}
.beforexx:before{content:url(back_listimg.jpg);}

 

注:IE8版本以下不支持标注2和3的属性

 

转载于:https://www.cnblogs.com/ninali/p/3569717.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/376100.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

蓝桥杯 花朵数

一个N位的十进制正整数,如果它的每个位上的数字的N次方的和等于这个数本身,则称其为花朵数。 例如: 当N3时,153就满足条件,因为 1^3 5^3 3^3 153,这样的数字也被称为水仙花数(其中&#xff0…

ROC曲线【转】

ROC曲线(Receiver Operating Characteeristic Curve)是显示Classification模型真正率和假正率之间折中的一种图形化方法 解读ROC图的一些概念定义: 真正(True Positive , TP)被模型预测为正的正样本 假负(F…

java eclipse oxygen_Eclipse Java Oxygen配置Tomcat

eclipse oxygen 配置tomcat 9.0第一步 装上eclipse的EE插件因为我以前学习java都是用eclipse oxygen的se版本,所以并不支持j2EE,所以第一步,就是要先把它升级为EE版本。有两种方法供我们选择。重新安装eclipse的EE版本。安装eclipse的EE插件。…

java 数组处理_JAVA操作数组

使用 Arrays 类操作 Java 中的数组Arrays 类是 Java 中提供的一个工具类,在 java.util 包中。该类中包含了一些方法用来直接操作数组,比如可直接实现数组的排序、搜索等Arrays 中常用的方法:1、 排序语法: Arrays.sort(数组名);可…

java拆装_JAVA线性表拆解

线性表(List)是一种线性结构。其特点是数据元素直线的线性关系。1.线性表抽象类定义public abstract class AbsList implements Iterable,List{protected int length;abstract public T get(int i); //返回第i(i≥0)个元素abstract public boolean set(int i, T x);…

【BZOJ】【1041】【HAOI2008】圆周上的点

数学 orz hzwer 完全不会做…… 很纠结啊,如果将来再遇到这种题,还是很难下手啊…… 引用题解: 【分析】: 样例图示: 首先,最暴力的算法显而易见:枚举x轴上的每个点,带入圆的方程,检…

【Android】配置APK开发环境

【Android】配置APK开发环境1.安装java jdk去oracle公司下载jdk-7u15-windows-i586.exehttp://www.oracle.com/technetwork/cn/java/javase/downloads/jdk7-downloads-1880260-zhs.html---C:\Documents and Settings\XXXX>java -versionjava version "1.7.0_15"Ja…

20135127陶俊杰 实验一

北京电子科技学院(BESTI) 《Java程序设计》课实验报告 班 级:201351 姓名及学号:陶俊杰 20135127 指导教师:娄佳鹏 必修/选修:选修 实验日期: 2015年4月16日 实验时间&…

Google Code Jam 2015 Round 1A Haircut 二分

题意:给你每个理发师的理发时间,问你排在队列中的第N个位置,问你应该被哪个理发师剪发。 解题思路:二分时间,看这个时间到第几个人理发了,然后找到临界值,看这个值的时候有那些理发师接待了新旅…

Base64 百科词条

Base64是一种基于64个可打印字符来表示二进制数据的表示方法。由于2的6次方等于64,所以每6个位元为一个单元,对应某个可打印字符。三个字节有24个位元,对应于4个Base64单元,即3个字节需要用4个可打印字符来表示。它可用来作为电子…

java获取mysql执行计划_好程序员Java学习路线之MySQL的执行计划

好程序员Java学习路线之MySQL的执行计划。什么是执行计划?执行计划通常是开发者优化SQL语句的第一步。MySQL在解析SQL语句时,会生成多套执行方案,然后内部会进行一个成本的计算,然后通过优化器选择一个最优的方案执行,…

Web系统开发构架再思考-前后端的完全分离

前言 前后端完全分离其实一直是Web开发人员的梦想,也一直是我的梦想,遥想当年,无论是直接在代码里面输出HTML,还是在HTML里面嵌入各种代码,都不能让人感到满意.期间的痛苦和纠结,我想所有Web开发人员都深有感触. 由于最近几年一直在MS平台,从Web Form到MVC,MS平台虽然易用好学,…

文科思维Java_开源之Processing:这好玩的编程语言是为文科生艺术家准备的

说起编程语言,我们很多时候第一反应就是很难,都是理工科计算机相关行业的人才学的,都是为理科生掉头发准备的。的确,计算机的严谨,注定要求开发应用的人有缜密的理工科的理性逻辑思维,然而一人客从另一方面…

poj 1862 Stripies/优先队列

原题链接&#xff1a;http://poj.org/problem?id1862 简单题&#xff0c;贪心优先队列主要练习一下stl大根堆 写了几种实现方式写成类的形式还是要慢一些。。。 手打的heap&#xff1a; 1&#xff1a; 1 #include<cstdio>2 #include<cstdlib>3 #include<cmath&…

java timezone id_java.util.TimeZone.setID()方法实例

全屏setID(String ID)方法被用于设置时区ID。这不会改变的时区对象中的任何其他数据。声明以下是java.util.TimeZone.setID()方法的声明。public void setID(String ID)参数ID--这是新的时区ID。返回值NA异常NA例子下面的例子显示java.util.TimeZone.setID()方法的使用package …

创建一个自己的GitHub,创建自己的开源项目

作者是一个大学在读学生&#xff0c;自己在平时的学习中&#xff0c;GitHub上的开源项目给自己提供了很大的帮助。GitHub是目前使用最广泛的分布式项目管理软件&#xff0c;GitHub上面托管了许多非常优秀的开源项目。我觉得每一个从事IT行业都应该有一个属于自己的GitHub。下面…

Ubuntu如何安装setuptools

首先百度setuptools&#xff0c;基本第一个就是官网的结果然后我们看到有两个这样的文件第一个不用想了&#xff0c;如果你要使用第一个的话&#xff0c;还要首先安装wheel。我们这里直接用鼠标选中第二个zip文件&#xff0c;然后右键&#xff0c;复制链接。然后在我们的Ubuntu…

JMeter学习(四)参数化、断言、集合点

1.参数化 录制脚本中有登录操作&#xff0c;需要输入用户名和密码&#xff0c;假如系统不允许相同的用户名和密码同时登录&#xff0c;或者想更好的模拟多个用户来登录系统。 这个时候就需要对用户名和密码进行参数化&#xff0c;使每个虚拟用户都使用不同的用户名和密码进行访…

php class使用方法,php的类使用方法问题

php的类使用方法&#xff1a;1、类通过class关键字来定义&#xff1b;2、访问对象的时候&#xff0c;属性名前不要加【$】&#xff1b;3、通过【->】访问修改类内成员变量&#xff1b;4、函数的返回值通过return来返回。php的类使用方法&#xff1a;1.语法说明和其他语言一样…