css插入原点 |css 标红

/* 第一种：插入圆点 */
.example:before{
content:"●";
color:#f00;
font-size:20px;
padding-right:5px;
}

上述代码中，大家通过在目标元素的 ::before 伪元素中插入 content 属性的值 “●” 来创建了圆点。通过 color 属性可以改变圆点的颜色，通过 font-size 属性可以改变圆点的大小，而 padding-right 属性则可以让圆点与目标元素之间有一定的间隔。

/* 第二种：插入三角形 */
.example:after{
content:"";
border-style:solid;
border-width:10px 10px 0;
border-color:#f00 transparent;
display:block;
width:0;
height:0;
position:absolute;
bottom:-10px;
right:0;
}

第二种实现方式则是通过在目标元素的 ::after 伪元素中设置 border 属性来创建一个等腰三角形。通过设置 border-color 属性可以改变三角形的颜色，通过 border-width 可以改变三角形的大小和形状，而 bottom 和 right 属性则可以让三角形的位置和目标元素进行相对定位。

以上是两种常见的 CSS 插入原点技巧，可以用于各种网页设计。同学们可以灵活运用，为自己的网页增添美感和个性。