コミュニティ
学ぶ
ツールライブラリ
AIツール
レジャー
検索
日本語
ホームページ ウェブフロントエンド H5 チュートリアル HTML5学習メモ(4) - リスト、ブロック、レイアウトのコード例

HTML5学習メモ(4) - リスト、ブロック、レイアウトのコード例

黄舟
黄舟
Mar 16, 2017 pm 03:41 PM

HTML list

リストタグ

タグ 説明
    		は順序付きリストを定義します。
      		順序なしリストを定義します。
    		• リスト項目を定義します。
      <dl> define 定義リスト。
      		定義定義項目。
      		定義の説明。
      <dir> は廃止されました。代わりに
        を使用してください。
      <メニュー> は廃止されました。代わりに
        を使用してください。

      1. 順序なしリスト

      使用タグ:

        、

      • 属性: disc、circle、square

        例:

        <!DOCTYPE html><html lang="en"><head>
    <meta charset="UTF-8">
    <title>聊表</title></head><body>
    <!--无序列表, 列表项为li-->
    <!--disc 实心圆, circle 空心圆, square 实行正方形, 依次更改运行看下--><ul type="disc">
    <li>apple</li>
    <li>orange</li>
    <li>bananer</li>
    <li>Berry</li></ul></body></html>
        ログイン後にコピー

        2. はいシーケンスlist

        は、タグ
          、
        1. を使用します

          属性: A、a、I、i、start

          <!DOCTYPE html><html lang="en"><head>
    <meta charset="UTF-8">
    <title>列表</title></head><body><!--有序列表, 列表项为li--><!--A: 以A,B,C...排序
    a: 以a,b,c...排序
    I: 以I, II, III...排序
    i: 以i,ii,iii...排序
    start: 自己定义排序的第一个--><ol type="i">
    <li>iOS</li>
    <li>Android</li>
    <li>Java</li>
    <li>Swift</li>
    <li>Objective-C</li></ol></body></html>
          ログイン後にコピー

          3. ネストされたリスト(順序付きリストのネスト、順序なしリストのネストを含む)

          タグ<を使用します;ul>、
            、

          1. <!DOCTYPE html><html lang="en"><head>
    <meta charset="UTF-8">
    <title>列表</title></head><body><!----><ul type="square">
    <li>iOS</li>
        <ul>
            <li>iPhone</li>
            <li>iWatch</li>
            <li>iPod</li>
            <li>iPad</li>
        </ul>
    <li>Android</li>
        <ul>
            <li>Any Call</li>
            <li>Oppo</li>
            <li>Vivio</li>
            <li>Huawei</li>
        </ul>
    <li>Objective-C</li></ul></body></html>
            ログイン後にコピー

            4. リストをカスタマイズします

            タグ
            、
            、
            を使用します

            <!DOCTYPE html><html lang="en"><head>
    <meta charset="UTF-8">
    <title>自定义列表</title></head><body><!--定义自定义列表--><dl>
    <!--定义自定义项目-->
    <dt>cast:</dt>
    <!--定义自定义描述-->
        <dd>vi. 1投掷扔抛, 2丢弃, 抛弃 3把...投向, 抛射, 4分派..., 扮演角色 5铸造, 浇铸 n. 全体演员</dd>
    <dt>forecast:</dt>
        <dd>v. 预测, 预报, /dd>        <dd>n. 预测, 预报<</dd>
    <dt>insight:</dt>
     <dd>n. 洞察力, 领悟 v. 洞悉, 了解</dd></dl></body></html>
            ログイン後にコピー

            HTMLブロック

            1.

            HTMLブロック要素 ブロック要素が表示される場合、通常は改行で始まります

            例:

            、

            、