对于上一小节的例子，我们想让那首诗显示得更美观些，如显示下面效果：

怎么可以让每一句诗词后面加入一个折行呢？那就可以用到<br />标签了，在需要加回车换行的地方加入<br />，<br />标签作用相当于word文档中的回车。

上节的代码改为：

语法：

xhtml1.0写法：

<br />

html4.01写法：

<br>

大家注意，现在一般使用 xhtml1.0 的版本的写法（其它标签也是），这种版本比较规范。

与以前我们学过的标签不一样，<br />标签是一个空标签，没有HTML内容的标签就是空标签，空标签只需要写一个开始标签，这样的标签有<br />、<hr />和<img />。

讲到这里，你是不是有个疑问，想折行还不好说嘛，就像在 word 文件档或记事本中，在想要折行的前面输入回车不就行了吗？很遗憾，在 html 中是忽略回车和空格的，你输入的再多回车和空格也是显示不出来的。如下边的代码。

上面的代码在浏览中显示是没有回车效果的。如下图所示：

总结：在 html 代码中输入回车、空格都是没有作用的。在html文本中想输入回车换行，就必须输入<br />。

示例:

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>br标签的使用</title>

</head>

<body>

<h2>《咏桂》</h2>

<p>暗淡轻黄体性柔，<br/>情疏迹远只香留。<br/>何须浅碧深红色，<br/>自是花中第一流。</p>

</body>

</html>

　　

使用<br>标签分行显示文本的更多相关文章

  1. <q>标签，短文本引用；<blockquote>标签，长文本引用

    <q>标签,短文本引用 <q>引用文本</q>,默认显示双引号,不需要在文本中添加 <blockquote>标签,长文本引用 浏览器对<block ...

  2. FusionCharts:tooltip分行显示

    FusionCharts:tooltip分行显示 tooltip分行显示:如果tooltip过长,可分行显示,在tooltip中增加{br} <chart> <set label=' ...

  3. pyqt5:标签显示文本框内容

    文本框(lineEdit)输入文本,标签(label)就会显示文本框的内容. 原理如下: 输入文本时,lineEdit控件发射信号textChanged(),label收到后触发setText()槽. ...

  4. HTML 折行 <br/>标签

    定义和用法: <br/>可插入一个简单的换行符. br标签是单独出现的,<br /> 当使用br标签时,其后面的所有内容都将在下一行出现 属性 Common -- 一般属性 c ...

  5. html之br标签

    <br>:自闭合 一般用法: 标签会告诉浏览器立即停止当前的文本流,并在下一行的左边继续输出,也通常用来在相临的段落之间制造一段垂直的间距. 代码: 效果: 问题:当段落中有表格或图片时怎 ...

  6. 10、NFC技术：读写NFC标签中的文本数据

    代码实现过程如下: 读写NFC标签的纯文本数据.java import java.nio.charset.Charset; import java.util.Locale; import androi ...

  7. 使用freemaker 导出word 含多张图片，若无图片则显示文本信息

    1.使用的Microsoft Office 2007,添加一个无边框的表格,并插入一张图片,最后另存为编码utf-8,一开始保存的word xml格式的,图片的base64编码位于文档最后,暂时没有找 ...

  8. 前端 html input标签 placeholder属性 标签上显示内容

    前端 html  input标签 的placeholder属性  标签上显示内容 <!DOCTYPE html> <html lang="en"> < ...

  9. 固定UILabel宽度分行显示

    固定UILabel宽度分行显示 这种小伎俩估计都被用烂了,笔者给大家提供一个category文件,供大家简单设置哦. 各种富文本效果哦(普通文本也是可以用的呢): 3行,固定宽度200 2行,固定宽度 ...

随机推荐

  1. mouseenter 和 mouseleave

    做一个下拉菜单的时候,HTML结构如下: <ul> <li class="red"> <a href="">第一级</ ...

  2. 【转】寻找最好的笔记软件:三强篇(EverNote、Mybase、Surfulater) (v1.0) (

    原文网址:http://blog.sina.com.cn/s/blog_46dac66f01000b57.html 寻找最好的笔记软件:三强篇(EverNote.Mybase.Surfulater) ...

  3. 贪心(数据结构)：COGS 468. [NOI2010]超级钢琴

    ★★★☆   输入文件:piano.in   输出文件:piano.out   简单对比 时间限制:2 s   内存限制:512 MB 超级钢琴 [问题描述] 小Z是一个小有名气的钢琴家,最近C博士送 ...

  4. Redis源码阅读笔记（1）——简单动态字符串sds实现原理

    首先,sds即simple dynamic string,redis实现这个的时候使用了一个技巧,并且C99将其收录为标准,即柔性数组成员(flexible array member),参考资料见这里 ...

  5. Square（强大的剪枝）

    http://acm.tzc.edu.cn/acmhome/problemdetail.do?&method=showdetail&id=2410 /* 题意; 给出一定数量的棍子用这 ...

  6. [Locked] Generalized Abbreviation

    Write a function to generate the generalized abbreviations of a word. Example:Given word = "wor ...

  7. Azkaban2官方配置文档

    最近工作实在是太忙了,我把之前翻译的官方的文档先放上来吧,希望对大家有所帮助~ 介绍 Azkaban2新功能: 1.Web UI 2.简单工作流上传 3.更容易设置job的依赖关系 4.调度工作流 5 ...

  8. Html中src、href的相对路径与绝对路径

    What is a path? Why is this something developers should care about? A path is simply the location of ...

  9. Git配置和一些常用命令

    Git:常用命令.... git clone <repo> git config –list git diff –staged add后,commit前的撤销:git rm –cached ...

  10. OS开发 touch事件的优先级和事件传递

    界面类的对象一般都是可以接触点击事件的,只不过有的默认接受,有的需要设定属性. userInteractionEnabled 属性设置为YES的时候就可以接受点击事件了 - (void)touches ...