CSS3学习之常见的4种伪元素选择器
在线学习好工作https://www.360docs.net/doc/e515695874.html,/ CSS3学习之常见的4种伪元素选择器
在CSS3开发中，常见的伪元素选择器主要有4种，下面就和大家一起来扒一扒。
first-line伪元素选择器
我们在这个后面接着来写，我们写一个段落
在CSS中，主要有四个伪元素选择器
first-line伪元素选择器用于向某个元素中的第一行文字使用样式。
我们所说的这个first-line，这个选择器是需要向某个元素中的第一行文字使用样式。因为这个br它是换行，也就是说我们使用first-line的话它会，对我们第一行文字进行一个样式，我们来看一下对不对
p:first-line{
color: #f60;
}
第一行我们给它一个橙色
第一行元素p的第一行文字，给它一个橙色，这就是我first-line的使用方法。
first-letter伪元素选择器
就拿我们这里的来测试，我们这样来
p:first-letter{
color: green;
font-size: 24px;
}
第一个文字我们给它一个绿色，然后呢给它加一个字体，我们看一下。
每一个元素中的第一个字我们都设为了绿色，这个字呢还很大很大。
after伪元素选择器
我们在这里新建一个ul在这个ul里面呢有这个很多的链接。
我们在这个链接之前给它加入一个符号，我们看一下怎样来实现。那么在加入之前我们先来看一下是什么样的一个样式。
设这样的一个样式，那么我们来给它这样来，它默认的这个例的话是有有一个前面有这个圆点。那么我们把它给去掉。那么怎样去掉，在这里。
li{
list-style: none;
}
这个方法来将它去掉。
这样就将默认的圆点给去掉了，然后我们在这个例之前呢给它加一个圆点，通过这个元素之前的方法给它一个追加，追加之前呢它一个小圆点。
li:before{
content:"...";
color: red;
}
我们来测试一下。在前面就有这个小点点了，那么我们加一个小圆点？
它就有很多个小圆点，这就是在前面追加的方式。我们来看在后面追加的方式。li:after{
content: "__after追加";
color: #ff6600;
}
before伪元素选择器
在每个
元素的内容之前插入新内容：
p:before
{
content:"内容：";
}
:before 选择器在被选元素的内容前面插入内容。
请使用content 属性来指定要插入的内容。
文章来源：麦子学院
原文链接：https://www.360docs.net/doc/e515695874.html,/wiki/css3/css/