HTML常用排版标签-今日头条

排版标签：主要和css搭配使用，用于显示网页结构，是网页布局最常用的标签。

标题标签

为了使网页更具有语义化，我们经常会在页面中用到标题标签，HTML提供了6个等级的标题，即：

<h1>到<h6>元素中的字母h是英文headline的简称。作为标题使用，其重要性以此递减。

基本语法格式：<hn> 标题文本 </hn>

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>doument</title>
  </head>
  <body>
    <h1>啊！今天天气真好呀！</h1>
    <h2>啊！今天天气真好呀！</h2>
    <h3>啊！今天天气真好呀！</h3>
    <h4>啊！今天天气真好呀！</h4>
    <h5>啊！今天天气真好呀！</h5>
    <h6>啊！今天天气真好呀！</h6>
  </body>
</html>

段落标签

在网页中要把文字有条理地显示出来，离不开段落标签，就如同我们平常写文章一样，整个网页也可以分为若干个段落。

基本语法格式：<p> 文本内容 </p>

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>doument</title>
  </head>
  <body>
    <p>今天天气真好啊真好啊真好啊真好啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊</p>
    <p>今天天气真好啊真好啊真好啊真好啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊</p>
    <p>今天天气真好啊真好啊真好啊真好啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊</p>
    <p>今天天气真好啊真好啊真好啊真好啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊</p>
  </body>
</html>

p标签是HTML文档中最常见的标签，默认情况下，文本在一个段落中会根据浏览器窗口的大小自动换行。

水平线标签

水平线标签用于在网页中添加水平线以将段落与段落隔开，使得文档结构清晰，层次分明。这些水平线可以通过插入图片实现，也可以简单地通过标签来完成。

基本语法格式：<hr />

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>doument</title>
  </head>
  <body>
    <p>今天天气真好啊真好啊真好啊真好啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊</p>
    <hr />
    <p>今天天气真好啊真好啊真好啊真好啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊</p>
    <hr />
    <p>今天天气真好啊真好啊真好啊真好啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊</p>
    <hr />
    <p>今天天气真好啊真好啊真好啊真好啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊</p>
    <hr />
  </body>
</html>

hr是单标签，能在网页中显示默认样式的水平线。

换行标签

在HTML中，一个段落中的文字会从左到右依次排列，直到浏览器窗口的右端，然后自动换行。如果希望某段文本强制换行显示，就需要使用换行标签。

基本语法格式：<br />

作用：在不另起一段的情况下将当前文本强制换行。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>doument</title>
  </head>
  <body>
    <p>今天天气真好啊真好啊真好啊真好<br />啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊</p>
  </body>
</html>

注意：这时如果还像在word中直接敲回车键换行就不起作用了。

HTML常用排版标签

头条热榜

精彩视频