HTMLのリストを学びます

ある意味では、任意のコンテンツは、説明テキストがリスト考えることができるではありません。国勢調査、太陽系、レストランのメニューなどのリストやリストのリストとして表すことができます。リストは順不同リスト、注文リストと定義リストに分かれている3種類

順序なしリスト

順不同リスト（リストunorder）略すUL、すなわち、なし値設定項目をソート、リスト内の順序は意味がありません。典型的には、ヘッド順不同リストアイテムは、点のようないくつかの形態、円形または正方形であってもよいです。スタイルヘッドは、HTMLページの説明で定義されていないが、それは、CSSのlist-style-typeプロパティに関連している可能性があり

[]デフォルトのスタイル

//IE7-浏览器margin-left: 30pt;
ul{
    margin: 16px 0;
    padding-left: 40px;
    list-style-type: disc;
}</pre>

<pre style="-webkit-tap-highlight-color: transparent; font-family: Courier, &quot;Courier New&quot;, monospace; display: block; padding: 1em; border: 2px solid rgb(221, 221, 221); border-radius: 4px; overflow-x: auto; line-height: 1.6; background: rgb(248, 248, 248);"><ul>
    <li>Coffee</li>
    <li>Milk</li>
</ul>
专门建立的学习Q-q-u-n： 731771211，分享学习方法和需要注意的小细节，不停更新最新的教程和学习技巧
（从零基础开始到前端项目实战教程，学习工具，全栈开发学习路线以及规划）

順序付きリスト

オール略記順序付きリスト（順序リスト）は、複数の項目の順序付きリストよりも表します。通常、順序付けられたリストは、項目番号（先行ナンバリング）の前に表示される、そのような数字、文字、またはさらに単純なポイントローマ数字のような任意の形態であってもよいです。HTMLページの説明ではスタイルの数を定義していませんが、list-style-typeプロパティを使用して、関連するCSS定義を使用することができます

[]デフォルトのスタイル

//IE7-浏览器margin-left: 30pt;
ol{
    margin: 16px 0;
    padding-left: 40px;
    list-style-type: decimal;
}

<ol>
    <li>Coffee</li>
    <li>Milk</li>
</ol>

[プロパティ]

HTML5は、オール2つの属性が追加されます。逆にして開始します

1、逆転

降順（IEとSafariがサポートされていません）

2、スタート

（なしスタート属性CSSの代わりの）リストを開始注文した商品

<ol reversed start="2">
  <li>咖啡</li>
  <li>牛奶</li>
  <li>茶</li>
  <li>可乐</li>
  <li>酒</li>    
</ol>

マーカー

マーカーは、リスト形式のパターンのみ表示値リスト項目の要素に適用することができるが、オール又は徴候におけるULのLiリスト項目を表し、しかしため継承スタイル、そうであっても、その後によってオール又はULでそれを適用します相続、そのすべては、Liリストスタイルのスタイル設定を取得すること。1つの李リストスタイルのスタイルへのセットは、その親リストスタイルのスタイルから継承オーバーライドする場合

list-style(列表项标志复合样式):list-style-type list-style-image list-style-position

1、リストスタイル型：リストアイテムマーカーの種類

2、リストスタイル-画像：ロゴ画像リスト項目

3、リストスタイルの位置：リスト項目フラグ

注：リストスタイルイメージがNoneでない場合は、リストスタイル型の値が上書きされます。通常、記号の「事後」タイプとして提供、負荷イメージに失敗した不測の事態に対処します

注意：IE7-浏览器不支持属性值 “decimal-leading-zero”、“lower-greek”、“lower-latin”、“upper-latin”、“armenian”、“georgian”

定义列表

定义列表(define list)简写是dl，是一个包含术语定义以及描述的列表，通常用于展示词汇表或者元数据(键-值对列表)

定义元素(define list title)用于在一个定义列表中声明一个术语。该元素仅能作为dl的子元素出现。通常在该元素后面会跟着dd元素

描述元素(define list describe)用来指明一个描述列表dl元素中一个术语的描述。这个元素只能作为描述列表元素的子元素出现，并且必须跟着一个dt元素

注意：一个dt可对应多个dd；

: 的display都是block

【默认样式】

dl{
    margin: 16px 0;
}
//IE7-浏览器margin-left: 30pt;    
dd{
    margin-left: 40px;
}
专门建立的学习Q-q-u-n： 731771211，分享学习方法和需要注意的小细节，不停更新最新的教程和学习技巧
（从零基础开始到前端项目实战教程，学习工具，全栈开发学习路线以及规划）

<dl>
    <dt>Coffee</dt>
    <dd>Black hot drink</dd>
    <dt>Milk</dt>
    <dd>White cold drink</dd>
</dl>

编程世界-云

发布了247 篇原创文章 · 获赞 9 · 访问量 7977

私信关注

順序なしリスト

順序付きリスト

定义列表

おすすめ