찾다

집 >웹 프론트엔드 >H5 튜토리얼 >H5 학습 여정-H5 목록 (8)

H5 학습 여정-H5 목록 (8)

黄舟
黄舟원래의
2017-02-17 14:33:331598검색

목록의 기본 구문

ol: 순서가 있는 목록

ul: 순서가 없는 목록

li: 목록 항목

dl : List

dt: 목록 항목

dd: 목록 설명

자주 사용하는 목록

순서가 지정되지 않은 목록: 태그 ul, li 속성 사용: disc (기본 단색 원) 원 (빈 원) 정사각형 (사각형)

2. 순서 목록: 태그 사용 ol, li 속성: A (대문자) a (소문자) l (대문자 로마 숫자 ) i ( 소문자 로마숫자) start (아라비아숫자 시작으로 설정)

3. 혼합 목록: ul ol li 태그 사용

4. 맞춤 목록: dl dt dd

태그 사용! ! ! ! ! ! 코드 예시

<!DOCTYPE html><html lang="en"><head>
    <meta charset="UTF-8">
    <title>H5表格</title></head><body>
   <ul type="square">
       <li>香蕉</li>
       <li>香蕉</li>
       <li>香蕉</li>
   </ul>
   <ol type="I">
       <li>香蕉</li>
       <li>香蕉</li>
       <li>香蕉</li>
   </ol>
   <ul type="square">
       <li>香蕉</li>
       <ol>
           <li>水谷</li>
           <li>水谷</li>
       </ol>
       <li>香蕉</li>
       <ol>
           <li>水谷</li>
           <li>水谷</li>
       </ol>
       <li>香蕉</li>
       <ol>
           <li>水谷</li>
           <li>水谷</li>
       </ol>
   </ul>
    <dl>
        <dt>hello world</dt>
        <dd>can you feel me</dd>
        <dt>hello world</dt>
        <dd>can you feel me</dd>
        <dt>hello world</dt>
        <dd>can you feel me</dd>
    </dl></body></html>

렌더링

H5 학습 여정-H5 목록 (8)

목록 기본 구문

ol: 순서 있는 목록

ul: 순서가 없는 목록

li: 목록 항목

dl: 목록

dt: 목록 항목

dd: 목록 설명

자주 사용되는 목록

1. 순서가 없는 목록: 태그 ul, li 속성 사용: disc(기본 솔리드 원) 원형(빈 원) 사각형(사각형)

순서가 지정된 목록: ol 태그 사용 , li 속성: A(대문자) a(소문자) l(대문자 로마숫자) i(소문자 로마숫자) start(시작 아라비아숫자 설정)

3. 혼합 목록: 태그 사용 ul ol li

4. 목록 맞춤설정: dl dt dd

태그를 사용하세요! ! ! ! ! ! 코드예

<!DOCTYPE html><html lang="en"><head>
    <meta charset="UTF-8">
    <title>H5表格</title></head><body>
   <ul type="square">
       <li>香蕉</li>
       <li>香蕉</li>
       <li>香蕉</li>
   </ul>
   <ol type="I">
       <li>香蕉</li>
       <li>香蕉</li>
       <li>香蕉</li>
   </ol>
   <ul type="square">
       <li>香蕉</li>
       <ol>
           <li>水谷</li>
           <li>水谷</li>
       </ol>
       <li>香蕉</li>
       <ol>
           <li>水谷</li>
           <li>水谷</li>
       </ol>
       <li>香蕉</li>
       <ol>
           <li>水谷</li>
           <li>水谷</li>
       </ol>
   </ul>
    <dl>
        <dt>hello world</dt>
        <dd>can you feel me</dd>
        <dt>hello world</dt>
        <dd>can you feel me</dd>
        <dt>hello world</dt>
        <dd>can you feel me</dd>
    </dl></body></html>

렌더링

H5 학습 여정-H5 목록 (8)

위 내용은 H5 학습여정-H5 목록(8) 내용입니다. PHP 중국어 홈페이지(www.php.cn)로!


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

관련 기사

더보기