H5 学習の旅 - H5 リスト (8)

黄舟
リリース: 2017-02-17 14:33:33
オリジナル
1595 人が閲覧しました

リストの基本構文

ol: 順序付きリスト

ul: 順序なしリスト

li: リスト項目

dl: リスト

dt: リスト項目

dd: リストの説明

よく使われるリスト

1順序なしリスト: タグ ul、li を使用します。 属性: disc (デフォルトの実線円)、circle (白丸)、square (正方形)

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 (デフォルトの実線の円)、circle (空の円)、square (正方形)

2. 順序付きリスト: タグ ol 、li 属性を使用します。 A (大文字) a (小文字) l (大文字のローマ数字) i (小文字のローマ数字) start (開始アラビア数字を設定)

3. 混合リスト: タグ ul ol li

を使用します。タグを使用して 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 中国語 Web サイト (www.php.cn) に注目してください。


関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート