HTML中强制换行和自动换行,网页中的纯文本如何强制换行(txt文件)

有的时候需要把文本文件中的内容显示到网页中,显示效果非常糟糕,比txt文本文件还差,不但没有行间距,连段落也没有了,所有段落被合并成一段,可阅读性变得十分差,可能阅读一会就不想读了。通常的处理方法是把每一段加上网页的段落标签或在每段的后段加上换行标签,如果网站有这个功能,这样处理再好不过;如果网站当初没有写这个功能,有没有办法让纯文本强制换行?

html标签中有一个

 标签,它正是用来显示纯文本的标签,把txt文件中的纯文本显示到 
 
 中,纯文本会依照 txt文件中的换行标记强制换行。这样就很好的解决了纯文本的换行问题,但段与段之间的距离不太好控制,要么距离太大要么距离太小,不易用CSS定义为段与段之间距离小一些、每几段之后距离应该适当大一些。 
 

网页中的纯文本如何强制换行实例

html代码:

用了html段落标记,纯文本被强制换行;不用段落标记,纯文本不会自动换行,所有在txt文本文件中的内容会合并为一段,阅读性相当差。

这是第二段,用了

 标签,本段会另起一行显示,不用 
  
 标签,本段会接在第一段的后面。 
 

CSS代码:

.div{margin:10px 0px; position:relative; border:1px solid #787878; width:420px; height:132px; line-height:24px;}

效果预览:

用了html段落标记,纯文本被强制换行;不用段落标记,纯文本不会自动换行,所有在txt文本文件中的内容会合并为一段,阅读性相当差。

这是第二段,用了

 标签,本段会另起一行显示,不用 
 
 标签,本段会接在第一段的后面。 
 

值得注意的是,用

 标签是按照文本文件中的段落强制换行,也就是文本文件中的一段如果超过网页中定义的宽度,则不会自动换行,会显示到元素的外面,如果想强制换行,需在 pre 的 style 属性中加 word-wrap:break-word。 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值