[翻译]标记语言和样式手册 Chapter 8 再谈清单
作者：zhaozy 来源：3user.com 发布时间：2008-01-29 13:16:00
阅读上一章：Chapter 7 锚点
Chapter 8 再谈清单
先前在第一章,我们讨论过几种标记清单的做法,研究以<ul>和<li>将它们标记成无序清单的好处.这个方法能标识清单的结构,确保所有浏览器与设备都能正确显示它的内容,同时也让我们能以CSS为它加上各种样式.
而在各种环境下,处理个别问题时标记清单的所有做法写出来的话塞满整本书都不难,我不打算塞满整本书,但是我的确打算以独立一章讨论除了无序清单之外的其他几种清单类别.研究几种适合使用清单的状况.
清单是个组织页面结构的强大工具,为每个独立的项目加上意义,让你能在稍后以css加上独立的样式.
让我们先来看看编了号的项目清单,以及两种标记这类清单的做法.或许你一眼就能看出哪种方法比较有益,但是我仍会再度详细说明这个例子,以便强调结构化标记,使用正确工具解决问题的重要性.
编号项目清单的标记法,哪种最好?
假设你打算标记一个步骤清单,每个项目之前都有编号,我们将会研究两种能够达成这个目标的不同方法,同时说明为何某个方法比较适用.
方法A:乱中有序
<ul>
<li>1. Chop the onions.</li>
<li>2. Saute the onions for 3 minutes.</li>
<li>3. Add 3 cloves of garlic.</li>
<li>4. Cook for another 3 minutes.</li>
<li>5. Eat.</li>
</ul>
前面这份清单可能是烹饪历史上最糟糕的食谱之一.但是拿来当简单的例子还蛮合适的,加点盐和鸡蛋可能好些,或是...不管,回到正题.
方法A我们选择以无序清单标记这些步骤,以便获得我们在第一章提过的所有好处,我们为内容加上结构,同时知道大多数浏览器,屏幕阅读器以及其他设备都能正确处理这部分内容,稍侯我们也能用css轻易为它指定样式,很棒!但是...
数字游戏
由于这是个有编号的清单,因此我们在每个项目之前加上编号,编号之后跟着句号,以便标识每个步骤的顺序,但是如果稍侯需要在第2步,第3步之间加上新步骤的话该怎么办呢?这下我们需要(手动)为新增步骤之后的所有项目重新编号.对这个清单来说,不是什么麻烦事,但是如果你正在修改某个具有100个项目的清单时,修改过程就会变得非常冗长乏味了.
出现小圆点符号
由于我们以无序清单标记这个示例中的结构,因此在每个编了号的项目之前都会看到一个小圆点符号(就像图8-1),你或许会喜欢小圆点符号,如果不喜欢的话当然可以通过CSS把它去掉,但是不使用CSS浏览这个清单的时候一定会再看到这些小圆点符号.
图8-1,浏览器关闭CSS阅读方法A的结果
有个更简单,更具意义,更容易维护的方法,让我们看看方法B.
0
投稿猜你喜欢
前几天因为一个例外，数据库在没有做备份的情况下，直接删除了表记录。事后，又需要查询到删除的记录的内容。因此，在网上软件SS了半天，发现Log- 你用过css么？当然，我是指你喜欢做网页的话，用过？很好，那你用过它的特效么？没有？那请跟我来。让我先
- 如何将123456789转化成123,456,789这样的形式呢？很多流量大的站比如优酷都有这样的格式。也是设计程序最常用的算
- 几个利用背景结合a:hover做的小东东，希望对大家有所帮助。<!DOCTYPE html PUBLIC "-//W3C//
- 某人使用如下过滤代码，发现经常被黑：n=request.form("username") p=request.form(
- ASP中给函数传参确实是个麻烦事，当参数个数特别多的时候（比如有七八个或者更多的参数个数）差不多就要眼冒金星了，一个个的数吧。而且要命的是参
- 在软件开发过程中经常会遇到数据库升迁的问题，原因比较多，如acsess访问速度比sql server慢、删除数据记录后access会留下空档
- 研究网页编码很长时间了，因为最近要设计一个友情链接检测的VBS脚本，而与你链接的人的页面很可能是各种编码，以前采取的方法是：如果用GB231
- 影响用户访问的最大部分是前端的页面。网站的划分一般为二：前端和后台。我们可以理解成后台是用来实现网站的功能的，比如：实现用户注册，用户能够为
- 如何用POP3接收电子邮件？POP3大行其道，我看见朋友已经用Jmail和POP3接收邮件了。该如何做？以Jmail4.1为例，我们演示一下
- 译者按：在iOS HIG已经强大经典了N年之后，Android终于推出了一套比较系统的HIG（大概是为了配合Android 4.0 Ice
- 这个javascript划词搜索功能，在很多地方我们都会看到，特别是装了浏览器插件的时候，当我们用鼠标选择一段文字的时候，就会出现搜索提示，
- 服务器重新启动的情况当mysqld启动时，所有的授权表内容被读进存储器并且从那时开始生效。被服务器立即应用的情况用GRANT、REVOKE或
- #mkdir /mysqldata2、创建/usr/sbin/bakmysql文件#nano /usr/sbin/bakmysql输入：#!
- 移动互联网被称为“第五次科技革命”，而随着iPhone和Android等智能手机的日渐流行和iPad等平板电脑的出现，移动互联网的潜力和趋势
- asp 在线备份 恢复 sql server 数据库，对于远程没有提供sql server远程连接或打包下载的朋友是个临时解决方法，对于大数
- 今天我升级MYSQL到5.1的时候遇到的。写出来共享以下。1、[root@localhost mysql]# scripts/mysql_i
- 图片的宽度和高度是未知的，没有一个固定的尺寸，在这个前提下要使图片在一个固定了宽度和高度的容器中垂直居中，想想感觉还是挺麻烦的，由于最近的项
- 因为写js经常需要用到访问样式，我们常用的做法是通过 DOM.style.XXX来读写样式信息的。可是DOM.style这种写法只能访问&l
- 代码如下:--创建测试表 DECLARE @Users TABLE ( ID INT IDENTITY(1,1), UserIn
