怎么定义每一行的文字下面都有下划线虚线？_html/css

怎么定义每一行的文字下面都有下划线虚线？_html/css_WEB-ITnose

php中文网

发布： 2016-06-24 12:13:05

原创

4685人浏览过

一个div里面，有很多文字，会自动分行显示。
我希望每行文字的下面都有下划线，且是虚线。

如何设置？

内容内容内容内容内容内容内容内容内容内容

阿里云-虚拟数字人

阿里云-虚拟数字人是什么？ ...

查看详情

回复讨论(解决方案)

注意：
效果要像信纸一样。
即使我文字不足一行，我依然希望每一行的下滑线都充满一行。

border-bottom:1px dashed red;

定义好DIV的宽度, 内容不够也会用下滑线

nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

star

内容内容内容内容内容内容内容内容内容内容内容

我的意思是：文字的每一行都要显示虚线下划线啊。

而不是div本身的下划线

xxxx

-----------------------------------------------------------------
做一个虚线背景，高度和DIV行距保持一致,比如28px; 虚线背景宽度可以比DIV的宽度大一些。

你硬要的话就用text-decoration:去设置吧

你硬要的话就用text-decoration:去设置吧
那是实线，不是虚线。

气死了没想起来 ps去吧

用背景图实现吧

注意：
效果要像信纸一样。
即使我文字不足一行，我依然希望每一行的下滑线都充满一行。
我的意思是：文字的每一行都要显示虚线下划线啊。
而不是div本身的下划线
看到你在1楼的声明，我很赞同2楼朋友提的方法“border-bottom:1px dashed red;”
不然要怎么做到，文字不足一行，仍然要每一行都显示下滑线呢？即使有其它方法实现，应该也是直接设置边框下样式更直接些吧

直接用背景图实现

用背景吧.控制好高和行高.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title></title><style type="text/css">.underline{	line-height:150%;	border-bottom:1px dotted #000;}</style></head><body><span class="underline">我是于娜我是于娜我是于娜我是于娜我是于娜我是于娜我是于娜我是于娜我是于娜我是于娜<br/>我是于娜我是于娜我是于娜我是于娜我是于娜我是于娜我是于娜我是于娜我是于娜我是于娜<br/>我是于娜我是于娜我是于娜我是于娜我是于娜我是于娜我是于娜我是于娜我是于娜我是于娜<br/></span></body></html>

登录后复制

&l;tabbr title="">sdfsdsdfffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</abbr>