On the usage of CSS common pseudo-class

Focus on the use of After and before:

How to become

The above directory structure is generated by jstree, we know that there is no tag behind, how to generate it?

Very simple, only CSS style can be done: tag element + pseudo-class after

a.task-pack:after{//My style name is this, you can write your own style name
Content: ' Packaged ';
Display:inline-block;
min-width:10px;
PADDING:3PX 7px;
margin-left:2px;
font-size:12px;
Font-weight:bold;
Color: #fff;
Line-height:1;
Vertical-align:middle;
White-space:nowrap;
Text-align:center;
Background-color: #009bdb;
border-radius:10px;
}

Sometimes it can be used to bind to a checkbox, and if we want to make a tick check box, it can be changed.

CSS3 Brother selector: Input:checked+label:after{css style}, as long as it is selected, the label label will have a corresponding style changes;

Before is placed in front of the element, and usage is similar to after

On the usage of CSS common pseudo-class