块元素特征及说明

块元素（Block-level elements）是在HTML文档中用于组织内容结构的一类元素。这些元素在默认情况下会以块（block）的形式显示，即它们会从新行开始，占据父容器的整个宽度，垂直方向上会有一定的间距。以下是块元素的一些特征及说明：

1. 独占一行： 块元素会独占一行，从新行开始显示。

2. 占据整个宽度： 块元素会占据其父容器的整个宽度，因此它会横向扩展到最大宽度。

3. 默认有上下间距： 块元素通常会有默认的上下间距，使其在垂直方向上与其他元素有一定的距离。

4. 可以包含内联元素和其他块元素： 块元素内部可以包含其他块元素和内联元素，因此可以构建复杂的嵌套结构。

5. 常见的块元素： 一些常见的块元素包括 <div>、<p>、<h1> 到 <h6>、<ul>、<ol>、<li>、<table>、<form> 等。

以下是一些常见的块元素及其说明：

• <div>： 用于组合其他HTML元素，常用于布局和组织内容。

  <div>
    <!-- 内容 -->
  </div>

• <p>： 定义段落。

  <p>这是一个段落。</p>

• <h1> 到 <h6>： 定义标题，级别从1到6逐渐减小。

  <h1>这是一级标题</h1>
  <h2>这是二级标题</h2>

• <ul> 和 <ol>： 分别定义无序列表和有序列表。

  <ul>
    <li>项目1</li>
    <li>项目2</li>
  </ul>
  
  <ol>
    <li>第一项</li>
    <li>第二项</li>
  </ol>

• <li>： 定义列表项。

  <ul>
    <li>项目1</li>
    <li>项目2</li>
  </ul>

• <table>： 定义表格。

  <table>
    <tr>
      <th>表头1</th>
      <th>表头2</th>
    </tr>
    <tr>
      <td>数据1</td>
      <td>数据2</td>
    </tr>
  </table>

• <form>： 定义表单。

  <form action="/submit" method="post">
    <!-- 表单元素 -->
  </form>

块元素在构建网页结构和布局时起着重要的作用，通过合理使用块元素，可以实现清晰的文档结构和良好的页面布局。

本文链接：https://www.weguiding.com/html/971.html