Common HTML block-level elements: A brief introduction to commonly used block-level elements in HTML

Common HTML block-level elements: A brief introduction to commonly used block-level elements in HTML, specific code examples are needed

HTML (Hypertext Markup Language) is a A markup language for creating the structure and content of web pages. It consists of various tags, of which block-level elements are a common type. Block-level elements refer to elements that occupy an entire line in an HTML document and are displayed in new lines.

There are many common HTML block-level elements. Below we will introduce several commonly used block-level elements and provide corresponding code examples.

1. element: used to wrap a group of related elements, usually used for layout and style control.

   Code example:

   <div>
     <h1 id="这是一个标题">这是一个标题</h1>
     <p>这是一个段落</p>
     <img src="/static/imghwm/default1.png"  data-src="image.jpg"  class="lazy"   alt="图片">
   </div>

   2. element: used to represent paragraph text.

   Code example:

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

   3. to

      elements: used to represent titles, where

      represents the highest-level title, < ;h6> represents the lowest level heading.

   Code example:

   <h1 id="这是一个一级标题">这是一个一级标题</h1>
   <h2 id="这是一个二级标题">这是一个二级标题</h2>

   4. and
      • elements: used to create an unordered list.

   Code example:

   <ul>
     <li>列表项1</li>
     <li>列表项2</li>
     <li>列表项3</li>
   </ul>

   5. and
      1. elements: used to create an ordered list.

      Code example:

      <ol>
        <li>列表项1</li>
        <li>列表项2</li>
        <li>列表项3</li>
      </ol>

      6. , and

         elements: used to create tables.

      Code example:

      <table>
        <tr>
          <td>单元格1</td>
          <td>单元格2</td>
        </tr>
        <tr>
          <td>单元格3</td>
          <td>单元格4</td>
        </tr>
      </table>

      7. element: used to create forms.

      Code example:

      <form>
        <label for="name">姓名：</label>
        <input type="text" id="name" name="name">
        <br>
        <label for="email">邮箱：</label>
        <input type="email" id="email" name="email">
        <br>
        <input type="submit" value="提交">
      </form>

      Using these block-level elements in HTML can make the web page have better structure and readability. By using these elements appropriately, you can create a variety of beautiful web pages. It is recommended that you make full use of these block-level elements when writing HTML code to improve the maintainability and scalability of the code.

The above is the detailed content of Common HTML block-level elements: A brief introduction to commonly used block-level elements in HTML. For more information, please follow other related articles on the PHP Chinese website!