css 红点提示消息 |css 表格中划线

红点提示消息可以通过CSS中的伪元素:before或者after来实现。一般情况下，红点用一个圆形div或者span来实现，然后在CSS中通过伪元素来添加父元素的内容，从而实现红点的提示效果。

.red-dot {
position: relative;
display: inline-block;
width: 20px;
height: 20px;
border-radius: 50%;
background-color: red;
margin-right: 5px;
}
.red-dot:before {
content: attr(data-bind);
display: inline-block;
position: absolute;
right: -10px;
top: -5px;
background-color: red;
color: #fff;
font-size: 12px;
padding: 2px 5px;
border-radius: 5px;
}

在上述代码中，大家定义了一个class为red-dot的样式，通过它来创建一个宽高为20px的红色圆点。然后，在它的伪元素:before中，大家使用content属性来获取父元素中的data-bind属性的值，并且添加到伪元素中，从而实现红点的提示效果。

这里需要注意一点的是，绝对定位的伪元素需要设置父元素相对定位，否则伪元素的位置可能会与实际效果不一致。

红点提示消息是一个非常实用的提示效果，在实际开发中会经常遇到。通过使用CSS中的伪元素来实现提示文本的效果，可以使开发效率更高，代码更简单。