HTML页面代码： CSS样式代码： 显示效果如下： 当鼠标停留在导航栏的链接上时，文字两旁会显示红色中括号。 CSS中伪元素说明 以上页面代码如下所示： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...
分类：
Web程序 时间：
2016-11-24 18:11:28
阅读次数：
297
css中的::after和::before已经被大量地使用在我们日常开发中了，使用他们可以使我们的文档结构更加简洁。但是很多人对::after和::before仍不是特别了解，究竟他们是做什么的？如何使用他们？什么时候应该使用他们？笔者总结了一些对伪元素的理解和使用经验。 一、概念： 1.定义 Th ...
分类：
Web程序 时间：
2016-11-24 07:56:09
阅读次数：
263
方法一： 用一个“ghost”伪元素（看不见的伪元素）和 inline-block / vertical-align 可以搞定居中，非常巧妙。但是这个方法要求待居中的元素是 inline-block，不是一个真正通用的方案。 html如下： css如下： 方法二： 可以用table布局方法，但是这种 ...
分类：
其他好文 时间：
2016-11-22 13:16:02
阅读次数：
294
1.1 清除浮动 清除浮动： 根据情况需要来清楚浮动 。 清除浮动的目的： 就是为了解决 父 盒子高度为0 的问题。 清除浮动： 1. 额外标签法 2. Overflow: hidden 触发 bfc 模式 就不用清楚浮动 3. 伪元素 .clearfix:after { content:””; V ...
分类：
其他好文 时间：
2016-11-21 19:36:02
阅读次数：
139
在对nth-child传参的时候，已经直接用公式，3n就表示3的倍数。多用伪类和伪元素，可以使代码更精简，多看一下。 ...
分类：
Web程序 时间：
2016-11-20 13:25:23
阅读次数：
177
前言：最近准备做一个自己的网页，设计稿中导航我准备设计成矩形，也有hover样式展示的矩形，当中一些头像等等。以前除了画圆，好像真没认真画过其他图形，今天就画画我们常见到的几个图形。 在此之前我们有必要了解下什么是伪元素(和它不同的，还有一个概念叫伪类，两者容易混淆)，没有它画不成图形的。 a）伪元 ...
分类：
Web程序 时间：
2016-11-17 07:42:31
阅读次数：
231
1.单个颜色实现按钮 hover 、active 的明暗变化 请点击 转载利用伪元素单个颜色实现 hover 和 active 时的明暗变化效果 2.利用after伪类清除浮动 3.增强用户体验，使用伪元素实现增大点击热区。适合用在点击区域较小的移动端,PC端看上去是很奇怪的哦 1 <!DOCTYP ...
分类：
Web程序 时间：
2016-11-15 23:18:59
阅读次数：
313
实现爱心效果图 源码 文章转载 【CSS进阶】伪元素的妙用--单标签之美 ...
分类：
其他好文 时间：
2016-11-15 23:05:35
阅读次数：
224
单伪元素：after (网易、新浪在用) afterj就是会在这个盒子的最后面生成一个内容：“” `.clearfix:after{ content:""; height:0; visibility:hidden; overflow:hidden; display:block; clear:both ...
分类：
其他好文 时间：
2016-11-15 08:05:53
阅读次数：
161
<!DOCTYPEhtml><htmllang="en"><head> <metacharset="UTF-8"> <title>伪类</title><style> /*伪元素选择器：伪元素的效果是需要通过添加一个实际的元素才能达到的。CSS中有如下四种伪元素选择器：·:first-line:为某个元素的第一行..
分类：
Web程序 时间：
2016-11-14 02:57:18
阅读次数：
971
