• XHTML学习笔记 Part4:列表


    1. 空格

    如果在两个单词中间放置几个连续的空格,默认情况下只会显示一个空格,这种情况成为空格折叠。同样,如果在源文档中开始一个新行,或者放置多个连续的空行,则这些新行将被忽略并被处理为一个空格。对制表符的处理也是如此。

    在浏览器中显示文本时,如果到达某行的末尾,则会自动在新行中继续显示文本

    <p>This   paragraph shows how   multiple spaces
         between     words are  treated as a single space. 
         This is known as white space collapsing, and  
         the big spaces between    some of the    words will not appear   
         in the  browser.   
         It also demonstrates how the browser will treat multiple carriage returns  
         (new lines) as a single space, too.</p> 

    2. 利用ul元素创建无序列表(在页面上放置项目符号列表)

     

    3. 有序列表(列表中的每一项的前缀不是项目符号,而是数值(1、2、3),字母(A、B、C、)或罗马数字(ⅰ、ⅱ、ⅲ))

     

    • 使用start属性(逐渐淘汰)改变有序列表中的起始数值
    • 使用type属性(逐渐淘汰)选择有序列表中的数值、字母或罗马数字:
    type属性的值  描述 示例
    1 阿拉伯数字(默认值) 1、2、3、4、5
    A 大写字母

    A、B、C、D、E

    a 小写字母 a、b、c、d、e
    I 大写罗马数字 Ⅰ、Ⅱ、Ⅲ、Ⅳ、Ⅴ
    i 小写罗马数字 ⅰ、ⅱ、ⅲ、ⅳ、ⅴ

    4. 定义列表

    定义列表提供术语,并且术语后面跟上简短的文本定义或描述。定义列表包含在<dl>元素中,<dl>元素中包含交替出现的<dt>和<dd>元素。

     5. 列表的嵌套

    示例:

     1 <?xml version="1.0" encoding="UTF-8"?>
     2 <!DOCTYPE html Public "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     3 
     4 <html xmlns="http://www.w3.org/1999/xhtml" lang="en">
     5 
     6 <head>
     7 <title>Wrox Recipes-World's Best Scrambled Eggs</title>
     8 </head>
     9 
    10 <body>
    11 <h1>Wrox Recipes-World's Best Scrambled Eggs</h1>
    12 <p>I adapted this recipe from a book called  
    13 <cite cite=" http:/www.amazon.com/exec/obidos/tg/detail/-  /0864119917/">Sydney Food</cite> by Bill Grainger. Ever since tasting these eggs on my 1<sup>st</sup> visit to
    14 Bill's restaurant in Kings Cross, Sydney, I have been after the recipe. I have since transformed  it into what I really believe are the<em>best</em> scrambled eggs  
    15 I have ever tasted.</p> 
    16 
    17 <p>This recipe is what I call a <q>very special breakfast</q>; just look at the ingredients to see why. It has to be tasted to be believed.</p> 
    18 
    19 <h2>Ingredients</h2>
    20 <p>The following ingredients make one serving:</p> 
    21 <ul> 
    22 <li>2 eggs</li> 
    23 <li>1 tablespoon of butter (10g)</li> 
    24 <li>1/3 cup of cream <i>(2 3/4 fl ounces)</i></li> 
    25 <li>A pinch of salt</li> 
    26 <li>Freshly milled black pepper</li> 
    27 <li>3 fresh chives (chopped)</li> 
    28 </ul> 
    29 
    30 <h3>Instructions</h3>
    31 <ol> 
    32 <li>Whisk eggs, cream, and salt in a bowl.</li> 
    33 <li>Melt the butter in a non-stick pan over a high heat <i>(taking care not to burn the butter)</i>.</li> 
    34 <li>Pour egg mixture into pan and wait until it starts setting around the edge of the pan (around 20 seconds).</li> 
    35 <li>Using a wooden spatula, bring the mixture into the center as if it were an omelet, and let it cook for another 20 seconds.</li> 
    36 <li>Fold contents in again, leave for 20 seconds, and repeat until the eggs are only just done.</li> 
    37 <li>Grind a light sprinkling of freshly milled pepper over the eggs and blend in some chopped fresh chives.</li> 
    38 </ol> 
    39 <p>You should only make a <strong>maximum</strong> of two servings per frying pan.</p> 
    40 
    41 </body>
    42 
    43 </html>
    View Code

    结果:

  • 相关阅读:
    C#客户端程序Visual Studio远程调试
    VS2013如何转成VS2010且不会出现此项目与Visual Studio的当前版本不兼容的报错
    Windows控件的命名规范
    VS2010中如何将exe文件生成setup安装文件
    Altium Designer Summer 09的操作
    Java SE(一)——java基础
    Java SE(二)——java语言基础
    重写与重载的区别
    Altium Designer Summer 09——元器件的封装
    Java SE(四)——java 面向对象入门
  • 原文地址:https://www.cnblogs.com/LilianChen/p/3242722.html
Copyright © 2020-2023  润新知