css文字下面加虚线 |css 背景色灰色

.text-under {
text-decoration: underline dotted; /* 虚线效果 */
}

以上是实现文字下方虚线效果的CSS代码。其中，text-decoration属性用来设置文字装饰效果，underline表示下划线，dotted表示点状虚线。

不过，这个虚线不够细致，如果希望虚线更加细致，可以使用border-bottom属性，代码如下：

.text-under {
border-bottom: 1px dotted #000; /* 虚线效果 */
}

这样，文字下方及其细致的虚线就出现了。同时，大家也可以通过CSS的其他属性，如color、font-weight等，进一步控制文字的样式，实现更高级的效果。

值得一提的是，这种虚线效果不仅可以应用在文字下方，还可以用在其他元素的下方，比如图片、按钮等等。只需要将text-decoration改为border-bottom即可。

CSS中还有很多美妙的效果，只有掌握了技巧，才能让网页更加出彩。快来尝试吧！