Rumah > hujung hadapan web > html tutorial > 怎么定义每一行的文字下面都有下划线虚线?_html/css_WEB-ITnose

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

WBOY
Lepaskan: 2016-06-24 12:13:05
asal
4471 orang telah melayarinya

一个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>
Salin selepas log masuk

&l;tabbr title="">sdfsdsdfffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan