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

怎么可以让每一句诗词后面加入一个折行呢？那就可以用到<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. 【贪心】CSU 1809 Parenthesis (2016湖南省第十二届大学生计算机程序设计竞赛)

    题目链接: http://acm.csu.edu.cn/OnlineJudge/problem.php?id=1809 题目大意: 给一个长度为N(N<=105)的合法括号序列.Q(Q<= ...

  2. 【最小生成树】Codeforces 707B Bakery

    题目链接: http://codeforces.com/problemset/problem/707/B 题目大意: 给你N个点M条无向边,其中有K个面粉站,现在一个人要在不是面粉站的点上开店,问到面 ...

  3. FZYZOJ-1880 【UFO】水管

    P1880 -- [ufo]水管 时间限制:1000MS      内存限制:131072KB      通过/提交人数:32/100 状态:      标签:    数学问题-组合数学   无    ...

  4. 动态规划——H 最少回文串

    We say a sequence of characters is a palindrome if it is the same written forwards and backwards. Fo ...

  5. 第一个嵌入汇编的C程序

    最近两天开始学习linux内核,看了赵炯博士的<linux内核完全注释>感觉受益匪浅.今天看到第三章 嵌入汇编部分,于是写了一个小程序试验了一下,用gcc编译通过.代码如下: #inclu ...

  6. hdu 4681 最长公共子序列+枚举

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4681 #include<cstdio> #include<cstring> # ...

  7. 分页过滤SQL求总条数SQL正则

    public static void main(String[] args) throws Exception { String queryForScanUsers_SQL = "selec ...

  8. G - MPI Maelstrom

    题目大意: BIT最近要取会他们的超级计算机,32处理器阿波罗奥德赛与分层通信子系统分布式共享内存的机器(听着很高端大气),瓦伦丁*麦基的顾问杰克*斯威特告诉她基准测试的新系统.(没有明白什么意思) ...

  9. angularJS 指令一

    指令1.指令本质上就是AngularJS拓展具有自定义功能的HTML元素的途径.通过自定义元素来创建指令,如:<my-directive></my-directive>.dir ...

  10. readmine项目管理和缺陷跟踪工具

    官方网站:http://www.redmine.org/演示地址:http://demo.redmine.org/下载地址:http://www.redmine.org/projects/redmin ...