Home >Web Front-end >HTML Tutorial >How to define that each line of text has an underline and dotted line? _html/css_WEB-ITnose
How to define that each line of text has an underline and dotted line? _html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 12:13:054474browse
一个div里面，有很多文字，会自动分行显示。
我希望每行文字的下面都有下划线，且是虚线。
如何设置？
f341b66843f0da09ec2faecebd653689
内容内容内容内容内容内容内容内容内容内容
16b28748ea4df4d9c2150843fecfba68
回复讨论(解决方案)
注意：
效果要像信纸一样。
即使我文字不足一行，我依然希望每一行的下滑线都充满一行。
border-bottom:1px dashed red;
定义好DIV的宽度, 内容不够也会用下滑线
b585974ae3b7dba3039af53a9593f9c4
383eb734b02b508089ba2d78eb4c6f68
93f0f5c25f18dab9d176bd4f6de5d30e
0f3eabac747cdf61a51589c5584ae6e8
b2386ffb911b14667cb8f0f91ea547a7star6e916e0f7d1e588d4f442bf645aedb2f
9c3bca370b5104690d9ef395f2c5f8d1
6c04bd5ca3fcae76e30b72ad730ca86d
18351f284dcc251c2de3ea60458d0c02
内容内容内容内容内容内容内容内容内容内容内容
16b28748ea4df4d9c2150843fecfba68
36cc49f0c466276486e50c850b7e4956
73a6ac4ed44ffec12cee46588e518a5e
我的意思是：文字的每一行都要显示虚线下划线啊。
而不是div本身的下划线
661c00c5ae8f8d57b2a1d5e0f96103b4
div{ background:url(line_bg.gif) repeat-y; line-height:28px; }
531ac245ce3e4fe3d50054a55f265927
dc6dce4a544fdca2df29d5ac0ea9906bxxxx16b28748ea4df4d9c2150843fecfba68
-----------------------------------------------------------------
做一个虚线背景，高度和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>