zoukankan      html  css  js  c++  java
  • 列表

     

      

    1.常见的列表元素:

    有序列表,无序列表,定义列表

    2.有序列表是指为其中的每个项目编号的列表。例如,有序列表可能是菜谱的一系列步骤,而这些步骤必须按照顺讯完成,也可能是一则法律合同,合同中的每项条文都需要指定一个序号。

    3.无序列表是指以点状项目符号(不同于表明顺序的字符)作为开头的列表。

    4.定义列表是由一系列术语及其定义组成的列表。

    5.使用由<ol>元素来创建有序列表,列表中的每个项目都被置于起始标签<li>和结束标签</li>之间(li代表列表项目)。

    6.使用<ul>元素来创建无序列表,列表中的每个项目都被置于起始标签<li >和结束标签</li>之间。

    7.定义标签由<dl>元素创建,并且通常包含一系列术语及其定义,在<dl>元素内部,经常会看到成对的<dt>和<dd>元素,<dt>元素用来包含被定义的术语,<dd>元素用来包含定义。

    8.嵌套列表可在<li>元素中放入另一个列表来创建子列表,或者叫嵌套列表。浏览器对嵌套列表的缩进比它的父级列表更深。在嵌套的无序列表中,浏览器通常也会改变项目符号的样式。

      示例

    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>定义列表</title>
    </head>
    <body>
    <dl>
        <dt>Sashimi</dt>
        <dd>Sliced raw fish that is served with condiment such as shredded daikon radish or ginger root,wasabi and soy
            sauce
        </dd>
        <dt>Scale</dt>
        <dd>A device used to accurately measure the weight of ingredients</dd>
        <dd>A technique by which the acales are remove from the skin of a fish</dd>
        <dt>Scamorze</dt>
        <dt>Scamorzo</dt>
        <dd>An Italian cheese usually made from whole cow's milk(although it was traditionally made from buffalo milk)</dd>
    </dl>
    </body>
    
    
    
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>无序列表</title>
    </head>
    <body>
       <ul>
           <li>1kg King Edward potatoes </li>
           <li>100ml milk </li>
           <li>50g salted butter </li>
           <li>Freshly grated nutmeg </li>
           <li>Salt and pepper to taste</li>
       </ul>
    </body>
    </html>
    
    
    
    !DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>定义列表</title>
    </head>
    <body>
    <dl>
        <dt>Sashimi</dt>
        <dd>Sliced raw fish that is served with condiment such as shredded daikon radish or ginger root,wasabi and soy
            sauce
        </dd>
        <dt>Scale</dt>
        <dd>A device used to accurately measure the weight of ingredients</dd>
        <dd>A technique by which the acales are remove from the skin of a fish</dd>
        <dt>Scamorze</dt>
        <dt>Scamorzo</dt>
        <dd>An Italian cheese usually made from whole cow's milk(although it was traditionally made from buffalo milk)</dd>
    </dl>
    </body>
    </html>
    
    
    
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>嵌套列表</title>
    </head>
    <body>
    <ul>
        <li>Mousees</li>
        <li>Pastries
            <ul>
                <li>Croissant</li>
                <li>Mille-feuille</li>
                <li>Palmier</li>
                <li>Profiterole</li>
            </ul>
        </li>
        <li>Tarts</li>
    </ul>
    </body>
    </html>
    
    
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Lists</title>
    </head>
    <body>
    <h1>Scrambled Eggs</h1>
    <p>Eggs are one of my favourite foods.Here is a recipe for deliciously rich scranbled eggs.</p>
    <h2>Ingredients</h2>
    <ul>
        <li>2 eggs</li>
        <li>1bts butter</li>
        <li>2bts cream</li>
    </ul>
    <h2>Method</h2>
    <ol>
        <li>Melt butter in frying pan over a medium heat</li>
        <li>Gently mix the eggs and cream in a bowl</li>
        <li>Once butter has method add cream and eggs</li>
        <li>Using a spatula fold the eggs from the edge of the pan to the center every 20 seconds(as if you are making an
            omelette)
        </li>
        <li>When the eggs are still moist remove from the heat(it will continue to cook on the plate until served)</li>
    </ol>
    </body>
    </html>
  • 相关阅读:
    UVAlive5135_Mining Your Own Business
    UVAlive3523_Knights of the Round Table
    UVA10759_Dice Throwing
    POJ3177_Redundant Paths
    UVA11027_Palindromic Permutation
    Codechef_JULY14
    UVAlive4255_Guess
    UVA10054_The Necklace
    杜教BM
    【2018徐州网络赛】Morgana Net (矩阵快速幂)
  • 原文地址:https://www.cnblogs.com/qq3069418554/p/8988121.html
Copyright © 2011-2022 走看看