
上QQ阅读APP看本书,新人免费读10天
设备和账号都新为新人
2.3.8 其他标签
还有一种标签,它们不是为了显示内容,只是实现某种功能,如换行、分割线,以及布局标签。
● <br>标签:可以在文本中生成一个换行。该标签是一个单标签,不需要包含其他的文本内容。
● <hr>标签:可以在文本中生成一条分割线。和<br>标签一样,该标签是一个单标签,不需要包含其他的文本内容。
● <span> 标签:没有具体的展示效果,只是用来页面局部布局。<span>标签可以和<span>标签共享一行,做水平布局。
● <div>标签:没有具体的展示效果,只是用来做页面局部布局。<div>标签独占一行,不会和其他标签共享一行,做垂直布局。
<span>标签用来表示无特殊语义的一些文本内容,其语法格式如下。

<div>标签语法格式如下。

通常情况下,<span>标签和<div>标签标记的内容需要使用 CSS 样式来进行修饰。下面创建test_div_span.html文件对这两个标签进行案例演示,示例代码如下。

运行代码查看效果,测试<div>标签的页面效果如图2-37所示。

图2-37 测试<div>标签的页面效果
结果表明,每个<div>标签独占一行,而所有<span>标签则默认共享一行。