html和CSS基础课程(2-8 2-9)

2-8 <blockquote>标签，长文本引用
<blockquote>的作用也是引用别人的文本。但它是对长文本的引用，如在文章中引入大段某知名作家的文字，这时需要这个标签。

  等等，上一节<q>标签不是也是对文本的引用吗？不要忘记`<q>`标签是对**简短文本**的引用，比如说引用一句话就用到`<q>`标签。

  如想在我的文章中引用李白《关山月》中的诗句，因为引用文本比较长，所以使用`**<**blockquote>`。

语法:

**<**blockquote>引用文本</blockquote>

如下面例子：

<pre class="code" style="margin: 0px; padding: 5px 10px; white-space: pre-wrap; font-family: Monaco, Menlo, "Ubuntu Mono", Consolas, source-code-pro, monospace; background: rgb(238, 238, 238); line-height: 1.6em; word-wrap: break-word; border: 1px solid rgb(204, 204, 204); border-radius: 2px; font-size: 13px; word-break: break-word; display: block;"><blockquote>明月出天山，苍茫云海间。长风几万里，吹度玉门关。汉下白登道，胡窥青海湾。由来征战地，不见有人还。 戍客望边色，思归多苦颜。高楼当此夜，叹息未应闲。</blockquote></pre>

浏览器对<blockquote>标签的解析是缩进样式。如下图所示：

image
2-9 使用
标签分行显示文本
对于上一小节的例子，我们想让那首诗显示得更美观些，如显示下面效果：

image

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

上节的代码改为：

image

语法：

xhtml1.0写法：

<br />

html4.01写法：

<br>

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

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

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

image