>웹 프론트엔드 >HTML 튜토리얼 >HTML 그룹화 요소

HTML 그룹화 요소

高洛峰
高洛峰원래의
2017-02-14 15:47:402758검색

HTML5分组元素

所谓分组元素就是用来组织相关内容的HTML5元素,清晰有效的进行归类

一、元素分类汇总

   元素名称                               说明    

p    表示段落    

div    一个没有任何语义的通用元素,和span是对应的元素    

blockquote    表示引自它处的大段内容    

pre    表示其格式应该被保留的内容    

hr    表示其段落级别的主题转换,即水平线    

ul,ol    表示无序列表,有序列表    

li    用于ul,ol元素中的列表项    

dl,dt,dd    表示包含一系列术语和定义说明的列表。dt在dl内部表示术语,一般充当标题,dd在dl内部表示定义,一般是内容    

figure    表示图片    

figcaption    表示figure元素的标题    


二、分组元素解析

1、

建立段落

这是一个段落


这是另一个段落


解释:

元素实际作用就是将内部元素包含的文本形成一个段落;而段落和段落之间保持一定的空隙


2、

通用分组

这是一个通用分组

这是另一个通用分组

설명:

요소는 초기 버전에서 매우 일반적으로 사용되었으며
의 일반적인 그룹화 요소를 통해 배치되었습니다. HTML5에서는 의미상 다양한 다른 문서 요소로 대체됩니다.

단락과의 차이점은 텍스트의 두 단락 사이에 위쪽과 아래쪽 공백이 없으며 간격 간격이

의 차이점을 비교해보세요rree

HTML 그룹화 요소

3. 내용

이것은 다른 곳에서 온 큰 문단입니다

이것은 다른 곳에서 온 또 다른 큰 문단입니다

설명:

요소의 실제 기능은

요소의 기능과 동일하며 시작과 끝 부분에 들여쓰기 기능도 포함되어 있습니다. 의미상으로 말하면 다른 곳에 있는 콘텐츠의 큰 부분을 나타냅니다.




4. 형식이 지정된 콘텐츠 표시 </pref></p><pre class="brush:html;toolbar:false"><p>这是一个段落</p> <p>这是另一个段落</p> <div>这是一个通用分组</div> <div>这是另一个通用分组</div>

: 요소의 실제 기능은 편집기가 이를 조판하는 방식이며 그대로 표시됩니다. 물론 이는 간단한 조판에만 적합하며 복잡한 조판은 요구 사항을 충족할 수 없습니다. </pref></p> <p><img src="https://img.php.cn//upload/image/930/634/103/1487058091703651.png" title="HTML 그룹화 요소" alt="HTML 그룹화 요소" style="max-width:90%" style="max-width:90%"></p> <p>5. </p> <hr>구분 추가 <pre class="brush:html;toolbar:false"><pref> ##### ##### ##### ##### ##### </pref>

설명: 이 요소의 실제 기능은 구분선을 추가하는 것입니다. 상황에 맞는 주제.

HTML 그룹화 요소

6.

  • 순서가 지정되지 않은 목록 추가
    <div>这是一个通用分组</div>
    <hr>
    <div>这是另一个通用分组</div>

    설명:

      < ;li>요소가 내부 목록 항목입니다


      7.

    1. 순서가 지정된 목록 추가
      <ul>
          <li>张三</li>
          <li>李四</li>
          <li>王五</li>
          <li>马六</li>
      </ul>

      설명: < ; ol> 요소는 순서가 지정된 목록을 나타내고,

    2. 요소는 내부 목록 항목을 나타냅니다. & lt; & gt; 현재 세 가지 속성을 지원합니다

      ol 요소 속성

      li 요소 속성 HTML 그룹화 요소

      HTML 그룹화 요소

      <ol>
          <li>张三</li>
          <li>李四</li>
          <li>王五</li>
          <li>马六</li>
      </ol>

      설명 목록 생성HTML 그룹화 요소

      HTML 그룹화 요소

      문서입니다

      이 문서의 세부정보는 다음과 같습니다1

      이 문서의 세부정보는 다음과 같습니다. 2

      설명: 이 세 가지 요소는 전체이지만

      또는
      ; 꼭 나오지 않아도 됩니다
      <ul>
          <li>张三</li>
          <li>李四</li>
          <li>王五</li>
          <li>马六</li>
      </ul>
      <ol>
          <li>张三</li>
          <li>李四</li>
          <li>王五</li>
          <li>马六</li>
      </ol>
      
      1. 张三
      2. 李四
      3. 王五
      4. 马六
      1. 张三
      2. 李四
      3. 王五
      4. 马六
      1. 张三
      2. 李四
      3. 王五
      4. 马六
      1. 张三
      2. 李四
      3. 王五
      4. 马六
      1. 张三
      2. 李四
      3. 王五
      4. 马六

      9.
      일러스트를 사용하세요

      <ol>
          <li>张三</li>
          <li>李四</li>
          <li>王五</li>
          <li>马六</li>
      </ol>
      
      1. 张三
      2. 李四
      3. 王五
      4. 马六

      HTML 그룹화 요소

      설명: 이 두 요소는 일반적으로 이미지 레이아웃에 사용됩니다.

      <dl>
      <dt>这是第一份文件</dt>
      <dd>这是第一份文件的详细内容1</dd>
      <dd>这是第一份文件的详细内容2</dd>
      <dt>这是第二份文件</dt>
      <dd>这是第二份文件的详细内容1</dd>
      <dd>这是第二份文件的详细内容2</dd>
      </dl>

      HTML 그룹화 요소 관련 추가 기사 PHP에 주목하세요. 중국사이트!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
이전 기사:HTML 요소 반복다음 기사:HTML 요소 반복