首页 > HTML & CSS > Html5 入门教程 > HTML 文本段落

文本段落列表

本章介绍文本段落等控制文字章节显示的标签。这些标签通常只起到展示排版作用(当然还有 SEO 的作用),其他的用途不多。

1. 标题

用于标题的 HTML 标签包括<h1> - <h6> 来定义。标题类似于 Word 中的标题,其作用是为了对文章进行排版,而不是只为了放大字号。良好的标题排版对搜索引擎比较友好。

<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>

展示效果如下:
图片描述
标题标签元素在 HTML5 使用较少,一般使用 css 样式控制文字大小。

2. 文档标题

title 用于定义文档的标题,通常嵌入到 header 头里边,其作用是:

  • 定义在浏览器中显示的文档标题
  • 当网页被添加到收藏夹时,显示在收藏夹的标题
  • 显示在搜索引擎中的标题

图片描述

title 标题显示在浏览器左上角

3. 段落

p 标签用于定义段落,它是一个块级元素,浏览器会自动在其前后换行

上述代码段使用 p 段落标签分隔了一首宋词浣溪沙,使用 div+css 可以实现相同效果
图片描述

4. 列表

4.1 有序列表

有序列表类似于 Word 中的有序列表,使用 ol 标签定义, li 标签定义列表项

在浏览器中展示如下

图片描述

其中有序列表中可以定义 start 属性,用于设置列表序号的起始值

4.2 无序列表

ul 无序列表不同于有序列表的是-列表中的编号使用粗体原点表示,而不是数字其可以通过定义 compact 和 type 来设置编号的样式,type 的可选值有 disc、square、circle。但是一般建议通过 css 统一控制样式。

上述代码展现的列表:

图片描述

4.3 自定义列表

自定义列表通过 dl 标签定义,使用 dt 定义标题, dd 定义内容。自定义列表可以实现类似 table 的效果。

图片描述

5. 总结

本章主要介绍了几种文本段落列表的控制标签以及属性,这些标签大部分用于文本排版。其实在在 HTML5 中,通过 css3+div 可以实现绝大多数效果,只不过需要对css非常熟悉才行,所以在不是非常熟悉 css 的情况下可以使用一些快捷的标签来实现相同的效果

本文来自互联网用户投稿,不拥有所有权,该文观点仅代表作者本人,不代表本站立场。
访问者可将本网站提供的内容或服务用于个人学习、研究或欣赏,以及其他非商业性或非盈利性用途,但同时应遵守著作权法及其他相关法律的规定,不得侵犯本网站及相关权利人的合法权利。
本网站内容原作者如不愿意在本网站刊登内容,请及时通知本站,邮箱:80764001@qq.com,予以删除。
© 2023 PV138 · 站点地图 · 免责声明 · 联系我们 · 问题反馈