中qstring去换行_段落和换行标签

本文介绍了HTML中段落`<p>`标签的使用,包括如何进行强制换行和处理空格。通过`<br>`标签实现强制换行,但不会增加段后距离。HTML会将多个空格和换行压缩为一个空格。为实现较大间距,可以使用HTML实体字符,例如连续的空格实体` `。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1.段落标签

网页中不乏段落,在HTML中我们使用p标签来表示一个段落。

段落语法

段落文字

示例:

<html lang="zh-CN"><head>    <meta charset="UTF-8">    <title>段落和换行标签title>head><body>    <h2>这是一篇文章h2>    <p>白马非马,花非花梦非梦p>    <p>这里是一段很长的文字这里是一段文字这里是一段文字这里是一段文字这里是一段文字这段文字这里是一段文字段文字这里是一段文字段文字这里是一段文字段文字这里是一段文字段文字这里是一段文字段文字这里是一段文字里是一段文字这里是一段文字这里是一段文字这里是一段文字p>body>html>

在浏览器预览如图:

9d78a979e5b9c83d7839c4fcc0e2e581.png

大家也看到了p标签内部文字内容自动换行了,而且段落之间自动添加了一个段后距离。大家留一下下面一个p标签的内容是不是很长啊,如果我想把这段文字分成两部分展示,或者我们想从中间让他换行,不是等它到达边际之后在换行,我们需要怎么做?

其实还有一个标签能够实现强制换行

2.段落标签

语法规则:

大家发现没有,这个标签和我们之前见过的标签不一样,我们之前见过的标签基本都是“内容标签名>”,而强制换行标签,是一个单标签他只有开始标签,没有结束标签。我们只需要在需要换行的文本的地方放
就可以了,请看下面例子:

<html lang="zh-CN"><head>    <meta charset="UTF-8">    <title>段落和换行标签title>head><body>    <h2>这是一篇文章h2>    <p>白马非马,花非花梦非梦p>    <p>这里是一段很长的文字这里是一段文字这<br /> 里是一段文字这里是一段文字这里是一段文字这<br />段文字这里是一段文字段文字这里是一段文字段文字这里是一段文字段文<br />字这里是一段文字段文字这里是一段文字段文字这里是<br />一段文字里是一段文字这里是一段文字这里是一段文字这里是一段文字p>body>html>

浏览器中预览效果如下:

091c85ff379f23f8d054a23b6ce4ca42.png

从预览效果中我们可以看到br标签在自己标签后面讲p段落文字强制换行了,但是他并没有增加段后距离只是强制换行而已,这一点需要大家注意。

3. html中换行与空格

另外我们来试试我们直接将一个段落的文字换行和在段落文字中敲多个空格看看页面会怎样?

<html lang="zh-CN"><head>    <meta charset="UTF-8">    <title>段落和换行标签title>head><body>    <h2>这是一篇文章h2>    <p>白马非马,花非花梦非梦p>    <p>      这里是          一段很长的文字这里是一段文字这      里是一段文字这里是一段文字这里是一段文字这      段文字这里是一段文字段文字这里是一段文      字段文字这里是一段文字段文      字这里是一段文字段文字这里是一段文字段文字这里      一段文字里是一段文字这里是一段文字这里是一段文字这里是一段文字    p>body>html>

预览效果如图:

205be83f553e40be5c416c7f2400b2fc.png

大家会发现我们在段落文字中敲了很多个空格,但是其实浏览器中只是识别出来一个,其他的空格没生效,换行也是,他并没有换行,只是识别成了一个空格,这是html的一个特性就是多个空格和换行会被当成一个空格。

那既然这样,我们有没有办法在页面中让两部分文字中间隔开很大的空间呢?其实方法也是有的,后期学到CSS我们可以使用两个标签将文字包裹,然后使用css去控制距离,但是其实HTML里面有很多实体字符可以实现将诸如空格这些操作字符化的方式展现出来,比如空格的实体符号是“    ” 如果我们想要在页面敲入多个空格现在我们就可以使用 来代替 我们来试试吧:

<html lang="zh-CN"><head>    <meta charset="UTF-8">    <title>段落和换行标签title>head><body>    <h2>这是一篇文章h2>    <p>白马非马,花非花梦非梦p>    <p>      这里是         一段很长的文字这里是一段文字这      里是一段文字这里是一段文字这里是一段文字这      段文字这里是一段文字段文字这里是一段文      字段文字这里是一段文字段文      字这里是一段文字段文字这里是一段文字段文字这里      一段文字里是一段文字这里是一段文字这里是一段文字这里是一段文字    p>body>html>

我们再来看看预览图:

faddd2e2646371761a8260f3f3062f7f.png

从预览图我们是不是看到已经有很多空格了,html实体字符还有很多比如大于符号(>)小于符号()符号时候通常也是用实体字符代替,这个课程里就给大家提一下,我不打算在后续课程体再去深入去提实体字符,小伙伴们知道有这么个东西,需要进一步了解的百度一下HTML实体字符进一步了解。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值