以下是小编整理的语法描写框架及术语的标记，本文共7篇，希望能够帮助到大家。

篇1：语法描写框架及术语的标记

语法描写框架及术语的标记

本文主要介绍当前境外描写语法的.主流倾向和分析语料的方法.为了读者方便起见,本文还提供了形态学和句法学常用的一些术语和缩写形式.

作 者：黄成龙 Huang Chenglong  作者单位：100081,北京,中国社会科学院民族学与人类学研究所 刊 名：民族语文  PKU CSSCI英文刊名：MINORITY LANGUAGES OF CHINA 年，卷(期)： “”(3) 分类号：H1 关键词： 

篇2：Silverlight图形：路径标记语法

先决条件

您应当熟悉 Geometry 对象的基本功能，

路径 Mini-Language

Silverlight 提供了可以将几何路径描述为 XAML 中的属性值的 mini-language。当您在 设置类型 Geometry 的属性（如 UIElement 的 Clip 属性或 Path 元素的 Data 属性）时， 就会使用这种 mini-language。下面的示例使用路径属性语法来创建形状。

XAML

Data=“M 10,100 C 10,300 300,-200 300,100” />

分隔符和空白

为简洁起见，下文中的语法部分显示的是单个空格，实际上在使用单个空格的地方也可以 使用多个空格。

如果结果字符串比较明确，则无需使用逗号或空白将两个数字隔开。例如，2..3 解释为 两个数字：“2.”和“.3”。同样，2-3 包含两个数字：“2”和“-3”。

命令前后的空格也不是必需的。

语法

XAML 路径语法由一个可选的 FillRule 值以及一个或多个图形说明组成。

路径 XAML 属性用法

术语说明 fillRuleFillRule

指定该路径使用 EvenOdd 还是 NonZero 填充规则值：

F0 指定 EvenOdd 填充规则。

F1 指定 Nonzero 填充规则。

如果省略此命令，则路径使用默认行为，即 EvenOdd。如果指定此命令，则必须将其置于 最前面。 figureDescription图形由移动命令、绘制命令和可选的关闭命令组成。

moveCommand drawCommands [closeCommand] moveCommand指定图形起点的移动命令。 drawCommands一个或多个描绘图形内容的绘制命令。 closeCommand可选的关闭命令，用于关闭图形。

移动命令

指定新图形的起点。

语法

M startPoint

- 或 -

m startPoint

术语说明 startPointPoint

图形的起点。

大写的 M 指示 startPoint 是绝对值；小写的 m 指示 startPoint 是相对于上一个点的 偏移量，如果是 (0,0)，则表示不存在偏移。当您在 move 命令之后列出多个点时，即使您 指定的是线条命令，也将绘制出连接这些点的线。

绘制命令

draw 命令可以由若干个形状命令组成。提供以下形状命令：直线、水平线、垂直线、三 次方贝塞尔曲线、二次贝塞尔曲线、平滑的三次方贝塞尔曲线、平滑的二次贝塞尔曲线和椭 圆弧线。

通过使用一个大写或小写字母输入各命令：其中大写字母表示绝对值，小写字母表示相对 值。线段的控制点是相对于上一线段的终点而言的。依次输入多个同一类型的命令时，可以 省略重复的命令项；例如，L 100,200 300,400 等同于 L 100,200 L 300,400。

直线命令

在当前点与指定的终点之间创建一条直线。l 20 30 和 L 20,30 都是有效的 line 命令 示例。

语法

L endPoint

- 或 -

l endPoint

术语说明 endPointPoint

直线的终点。

水平线命令

在当前点与指定的 x 坐标之间创建一条水平线。H 90 是有效的水平线命令示例。

语法

H x

- 或 -

h x

术语说明 xDouble

线的终点的 x 坐标。

垂直线命令

在当前点与指定的 y 坐标之间创建一条垂直线。v 90 是有效的垂直线命令示例。

语法

V y

- 或 -

v y

术语说明 yDouble

线的终点的 y 坐标。

三次方贝塞尔曲线命令

通过使用两个指定的控制点（controlPoint1 和 controlPoint2）在当前点与指定的终点 之间创建一条三次方贝塞尔曲线。C 100,200 200,400 300,200 是有效的曲线命令示例。

语法

C controlPoint1 controlPoint2 endPoint

- 或 -

c controlPoint1 controlPoint2 endPoint

术语说明 controlPoint1Point

曲线的第一个控制点，用于确定曲线的起始正切值。 controlPoint2Point

曲线的第二个控制点，用于确定曲线的终止正切值，

endPointPoint

曲线将绘制到的点。

二次贝塞尔曲线命令

通过使用指定的控制点 (controlPoint) 在当前点与指定的终点之间创建一条二次贝塞尔 曲线。q 100,200 300,200 是有效的二次贝塞尔曲线命令示例。

语法

Q controlPoint endPoint

- 或 -

q controlPoint endPoint

术语说明 controlPointPoint

曲线的控制点，用于确定曲线的起始和终止正切值。 endPointPoint

曲线将绘制到的点。

平滑的三次方贝塞尔曲线命令

在当前点与指定的终点之间创建一条三次方贝塞尔曲线。第一个控制点假定为前一个命令 的第二个控制点相对于当前点的反射。如果前一个命令不存在，或者前一个命令不是三次方 贝塞尔曲线命令或平滑的三次方贝塞尔曲线命令，则假定第一个控制点就是当前点。第二个 控制点，即曲线终端的控制点，由 controlPoint2 指定。例如，S 100,200 200,300 是一个 有效的平滑三次方贝塞尔曲线命令。

语法

S controlPoint2 endPoint

- 或 -

s controlPoint2 endPoint

术语说明 controlPoint2Point

曲线的控制点，用于确定曲线的终止正切值。 endPointPoint

曲线将绘制到的点。

平滑的二次贝塞尔曲线命令

在当前点与指定的终点之间创建一条二次贝塞尔曲线。控制点假定为前一个命令的控制点 相对于当前点的反射。如果前一个命令不存在，或者前一个命令不是二次贝塞尔曲线命令或平滑的二次贝塞尔曲线命令，则此控制点就是当前点。

语法

T controlPoint endPoint

- 或 -

t controlPoint endPoint

术语说明 controlPointPoint

曲线的控制点，用于确定曲线的起始正切值。 endPointPoint

曲线将绘制到的点。

椭圆弧线命令

在当前点与指定的终点之间创建一条椭圆弧线。

语法

A size rotationAngle isLargeArcFlag sweepDirectionFlag endPoint

- 或 -

a size rotationAngle isLargeArcFlag sweepDirectionFlag endPoint

术语说明 大小x, y pair

弧线的 x 轴半径和 y 轴半径。 rotationAngleDouble

椭圆的旋转度数。 isLargeArcFlag如果弧线的角度应大于或等于 180 度，则设置为 1；否则设置为 0。 sweepDirectionFlag如果弧线按照正角方向绘制，则设置为 1；否则设置为 0。 endPointPoint

弧线将绘制到的点。

关闭命令

close 命令终止当前的图形并创建一条连接当前点和图形起点的线。此命令在图形的最后 一个线段与第一个线段之间创建一条连线（转角）。

语法

Z

- 或 -

z

点语法

点语法描述点的 x 坐标和 y 坐标。

语法

x,y

- 或 -

x y

术语说明 xDouble

点的 x 坐标。 yDouble

点的 y 坐标。

特殊值

除标准数值以外，您还可以使用以下特殊值。这些值区分大小写。

值说明 Infinity表示正无穷大的 Double 值 (Double.PositiveInfinity)。 -Infinity表示负无穷大的 Double 值 (Double.NegativeInfinity)。 NaN表示 NaN Double 值 (Double.NaN)。

此外，您还可以使用科学计数法。例如，+1.e17 是有效值。

篇3：被动式标记语法化的认知基础

被动式标记语法化的认知基础

本文运用类型学和认知语言学的方法,对古今汉语和少数民族语言的.被动标记进行比较研究,着重探讨汉语被动式跟其他语言之间的共性与个性.

作 者：石毓智 Shi Yuzhi  作者单位：410081,长沙,湖南师范大学外国语学院,新加坡国立大学文学院 刊 名：民族语文  PKU CSSCI英文刊名：MINORITY LANGUAGES OF CHINA 年，卷(期)： “”(3) 分类号：H1 关键词： 

篇4：标准化设计解决方案 Part 1: 从标记语法谈起 Chapter 1 清单网页设计

标准化设计解决方案 - 标记语言和样式手册

Web Standards Solutions The Markup and Style. Handbook

Part 1: Get Down With Markup 从标记语法谈起

Chapter 1 清单

在网络上几乎每个页面都能找到清单. 超链接清单;购物车物品清单;你中意的电影清单...甚至是整个网站的导航清单.可能在某些人看来,清单的建立是随心所欲的,但是我们要去探索发现的正是如何建立清单以及集中几种常用方法的优缺点.稍后,我们会列出几个如何美化普通清单一集他们的优缺点的示例来.

咱们去购物吧

最初,我打算用一个细目清单(洗衣清单)来作为本章的示例,但是很快的,我就意识到,我根本不知道这种清单中应该包括那些细目,所以...看在示例的份上,就用食物来举例吧!

让我们设想,你需要把一个食品清单放到你自己的网站上去,你可能会为为什么要把食物清单放到网站上去而感到不解,厄,这个可能就离题了,我们只是需要一个可以开始为清单思考的理由罢了...

在页面上,假设我们想让清单看起来像......好吧,看起来就像一个清单 — 也就是一长串垂直的列表,里面的每项内容独占一行:

Apples

Spaghetti

Green Beans

Milk

看起来非常简单,不是吗?和页面设计开发的许多方面类似,我们能够通过很多不同的方法达成相同(或者类似)的效果.与这本书后面所有的示例相同的,我将以eXtensilble HyperText Markup Language(XHTML)的观点来展现所有示例 — 并且确认选用的方法都使用正确的标记语法,遵照World Wild Web Consortium (W3C)所制定的各种标准.

我们可以轻松的在每个项目后面加上个

标签就搞定了,或者也能使用各种清单项目标签来完成这个工作,现在我们就来看3种完全不同的方法,以及每种方法的特点.

提问时间

下面哪种方法最适合建立食品清单?

方法 A: 用

换行

Apples

Spaghetti

Green Beans

Milk

方法A的确是一种被广为传用的方法,可能有数百万个页面使用过,事实上,我相信我们中的每个人都会偶尔因为使用了这种方法而感到内疚,对吧?我们希望在清单中的每一项都独占一行,而加入了换行标签(在这里使用的是符合xhtml标准的自关闭标签

)就会在每个项目后面生成断行,这就是他所有的效果了,看起来,挺管用的.

但是,如果我们想要给这个食品清单加上与其他页面元素不同的样式的时候该怎么办呢?比方说:如果想让清单的所有链接的颜色变成红色而不同于默认的蓝色,或者想要改变字体的大小时该怎么办呢?真的我们什么都做不了,我们被为整份html文档设定的字体风格(如果有设定的话)限制住了.同时,如果在清单外面没有任何标签围绕,我们就没办法为清单制定一个独特的css规则.

折行

如果我们在清单中加入一个类似“Five Foot Loaf of Anthony”s Italian Bread“.根据这个清单在页面里摆放的位置,在水平空间不足或者浏览者的浏览器视窗比较窄的情况下,过长的项目就会冒着折到下一行的风险.

同时我们也要考虑到视力不佳的用户可能会把预设的字体大小改大以便增加可读性,我们认为能够像 图1 - 1 一样把项目轻松的布置在窄栏里,但是很有可能会像 图 1 - 2 这样在意料之外的地方发生断行,读者调大字体时,设计的样式就完全变样了.

图 1 - 1 预设文字大小的范围

图 1 - 2 调大文字大小后的相同内容

唔......现在,我想我应该要买面包是没错,但是在 图 1 - 2 里,面包上面的两行字实在感到疑惑.

在使用小屏幕装置像是移动电话或者PDA阅读长行时,类似的换行问题就会展露它丑恶的嘴脸,骨灰级的科技爱好者可能会随手带着记录购物清单的Palm Pilot(而不是传统意义上的纸和笔)当他在超级市场里面闲逛的时候,最后却在货架中寻找一种叫”Anthony“s Italian”的东西.

在这里我要在本质上阐明一个观点 - 使用方法A ,并没有把阅读网页时的这些设计师们所无法控制的变数考虑在内.

方法 B: 会咬人的小圆点

Apples

Spaghetti

Green Beans

Milk

大多数成熟的浏览器在解析

标签时都会在清单项目的左侧加上圆点符号,你能通过方法B来达到这个效果,在需要圆点符号时加入

标签.但是如果

标签没有被包含在适当的父标签中时,那有些浏览器不会显示出圆点符号,适当的父标签包括强大的以及

的另一个父标签

(有序清单),这个会在稍后有更多的讨论.

圆点符号的出现在某种程度上的确能够帮助解决换行问题,每个食品项目在左边会有小圆点符号,如果某个项目过长折行的话,旁边没有小圆点符号应该就可以很明显的看出这并不是全新的项目,但是方法B仍然有显示结果意外的问题:它并不符合标准.

麻烦检查一下

根据W3C的XHTML 1.0规范,所有的标签最后都必须要闭合起来 — 如果我们还是继续使用上面示例中的写法,让所有的

保持开放状态的话,那就太丢脸了!

在行末使用

标签来模拟正确的无序清单自动换行的显示效果,但其实我们有更好的方法.

一向以来,养成编写正确的标签语法的习惯非常重要,正确的编写标签语法,我们可以不必在未来担心由于没有闭合标签或者不正确的嵌套元素所带来的问题.如果有人阅读这些源代码的话,也可以使他们更加深入的理解源代码想要达成的效果.

记得善用W3C的在线检测工具(validator.w3/)来检查你提交的URI或者上传的文档,最终你会觉得这样做非常值得.

方法 C: 接近了

Apples

Spaghetti

Green Beans

Milk

方法C更加的接近完美的解决方案了,但是还是悲惨的失败了,原因还是非常明显:这仍然不符合标准的标记语法.

我们已经把

标签关闭了,因为

是块级元素(block-level),因此在使用上可以去掉

标签,这样每个项目都独占一行,但是,我们却漏了它的外层结构,缺少了一个表示“这群项目是一个清单!”的元素.

从语义化的角度看这个问题也非常重要 — 清单是一组项目归属在一起,因此我们应该为它们加上这样的标签,此外,使用正确的清单标签能清楚告诉浏览器,软件或者显示设备“这组项目是个清单!”,语义化标签的意义就在于将内容根据他们所属的类别进行结构性的搭建.

块级(block-level)与行内(inline): HTML元素可以分为块级与行内两大类型,块级元素会从新行开始,最后接着一个断行,而行内元素则会与其他的行内元素显示在同一行内,块级元素可以包括其他块级元素和行内元素,而行内元素里面不能包含块级元素.

块级元素包括:,

-

,等等,行内元素包括:,

如果以纯XML的角度来看我们的食品清单,或许我们会使用这样的方式进行标注:

,,等等.

Apples

Spaghetti

Green Beans

Milk

整个清单有一个容器元素,所有的食品项目都包含在里面,以这种方式归类项目,可以基于XML的应用轻松的从清单里面抽取出所有的项目.

举例来说,一个开发者需要编写一份XSLT样式表,将这个清单转成xhtml,纯文字,甚至是pdf文件,因为列表项目的结构表现的非常清晰,所以程序可以轻松的获取信息并作出一些有用的处理.

虽然在这本书里我并不直接处理XML,但是这些原则也适用于XHTML世界,如果文档使用非常语义化的标签结构,将可以提升文档今后的灵活度,不管是为结构清晰的文档加上css样式表还是修改容易理解的文档 — 只要提供正确的结构,就能节省许多今后在维护时可能浪费掉的时间.

接着,我们仔细的看看方法D,看看这些怎么样结合在一起 — 一个能被大多数浏览器和屏幕阅读器识别并显示的文档,同时又允许我们使用各种不同的方法为文档加上样式.

方法 D: 愉快的包装者

Apples

Spaghetti

Green Beans

Milk

是什么让方法D变得如此特别?首先,它的语法完全正确,正确的无序清单具备了容器元素,同时每个项目都已

元素闭合起来.到这里你会想问,我们花费了那么多力气只来示范为了正确而正确?我们来看看这样做能带来的好处:

由于我们正确的标记了我们的食品清单,每个项目都会独占一行(因为块级元素

的关系),而且大多数浏览器会给每个项目的左边增加一个小圆点符号,并且进行正确的行内缩进换行.(见图 1 - 3)

图1 - 3

PDA,移动电话,或者其他的小屏幕设备的用户也可以看到清楚的,关系明确的组织方式,由于我们告诉了这些设备这些资料的类型(在这个示例里是清单),因此这些设备能够根据自己的能力决定怎样显示才能达到最好的效果.

如果因为放大字号或者缩小浏览器视窗宽度等原因造成换行,那么被换行的文字会行内缩进到与第一行文字对齐的位置,所以不管浏览器环境如何,都可以轻松的识别每个清单项目.

概要

我们已经针对每种可能的方法进行讨论了,现在让我们快速的回顾一下刚才讨论过的东西:

方法A:

无法为清单加上独特的样式

在狭窄的列里或者小屏幕设备上,较长的内容可能会因为换行而造成误解

缺乏语义性

方法B:

增加小圆点符号来帮助识别每个项目,但是一些浏览器会在缺失父级标签时可能不显示小圆点符号

没有放在中,缺少闭合标签

意味着难于加上样式

不标准

方法C:

加上了闭合标签

后就不需要

标签了

省略了元素使得我们难于为这个清单添加特定的样式

不标准

方法D:

符合标准!

使文档语义化,结构性

大多数浏览器都会在每个项目左边显示小圆点符号

在大多数浏览器上都会在换行后行内缩进

很容易就可以定义特定的css样式

正如你所见,你可以从一个看起来很简单的问题上获得不少知识.就算是你已经在你所有的页面上都是用了方法D,还是可以你为什么这样做比较好,我们会在这本书里一直探索“为什么”的问题,让你在各种情况下选用最恰当的方法.

技巧延伸

让我们利用我们构造出来的食品清单来试看看几种用定义css样式的方法,我们将抛开预设样式,加入自定义的圆点符号,接着把它转成横向,把它变作一个导航条.

扔掉圆点

“我真的不喜欢食品清单里的那些个小圆点,我想我还是用回

吧.”

不需要回到***惯 — 我们仍然可以使用我们结构化的无序清单,然后使用css关闭掉小圆点符号和行内缩进,关键在于我们保留了清单的结构,然后以css具体的呈现出来.

首先,加上一段去掉圆点符号的css规则:

ul{

list-style.:none;

}

显示的结果见图1 - 4

图 1 - 4 去掉小圆点符号

接着我们来去掉行内缩进,根据预设值,所有无序清单左边都会留有一些内补丁(padding),但是不用担心,我们可以随心所欲的裁掉:

ul{

list-style.:none;

padding-left:0;

}

显示结果可见图1 - 5

图 1 - 5

虽然图 1 - 5 看起来和使用了几个

标签的效果几乎一样,但是它还是符合标准的,结构化的无序列表 — 不管什么浏览器,设备都能正常显示,如果必要的话只需要更新几条css规则就能换上不同的样式了.

使用自定义圆点符号来完成自己的想象

或许你想要在清单里保留小圆点符号,但是不想用浏览器无趣的默认设置,更像用自己的小圆点图案.有两种方法可以达成你想要的 — 而我更推崇第二种方法,因为它可以在各种浏览器之间更好的兼容.

第一种方法是用 list-style-image 属性来指定用来替代默认小圆点的图片名称.

ul{

list-style-image:url(i_hot.gif)

}

这是最简单的方法,但是它会在不同浏览器之间的图片垂直对齐位置上有所不同,有些浏览器会把图片和项目文字中线对齐,也有的会把图片放得稍微高一点,它们之间有一点不一致.

为了避免 list-style-image 造成的几个流行浏览器之间的对齐问题,我比较喜欢用一种替代方法:把图片作为每个

元素的背景.

首先,我们要去掉默认的圆点,然后再加上我们自己的背景图片:

ul{

list-style.:none;

}

li{

background-image:url(i_hot.gif) no-repeat 0 50%;

padding-left:25px;

}

no-repeat 会告诉浏览器不把背景图片进行平铺操作(默认会平铺),而0 50%会告诉浏览器把背景图片放置在距离左边 0 像素,距离上面 50% 的地方,让背景图片 i_hot.gif 根据中线对齐.我们也可以用精确的像素来指定位置,比如说 0 6px 会让图片放置在距离左边0像素,距离上面 6 像素的位置上.

我们还要在清单项目的左边加上17像素的内补丁(padding),以便我们把宽20像素高11像素的图片能够完整显示出来,同时又留有一点空白,而不会和文字有重叠.这些数据应该根据你所使用的图片尺寸进行调整( 图 1 - 6 )

图 1 - 6 自定义圆点图片的清单

来自：www.blueidea/tech/web//5284.asp译者：zhaozy 小宁

点击看大图

篇5：标准化设计解决方案 Part 1: 从标记语法谈起 Chapter 5 表单网页设计

标准化设计解决方案 - 标记语言和样式手册

Web Standards Solutions The Markup and Style. Handbook

Part 1: Get Down With Markup 从标记语法谈起

Chapter 5 表单

前文回顾：

标准化设计解决方案 Part 1: 从标记语法谈起 - Chapter 1 清单

标准化设计解决方案 Part 1: 从标记语法谈起 - Chapter 2 标题

标准化设计解决方案 Part 1: 从标记语法谈起 - Chapter 3 邪恶的表格

标准化设计解决方案 Part 1: 从标记语法谈起 - Chapter 4 引用

互动性一直是互联网的重点,让使用者与网站能够交换信息,彼此沟通.表单使我们能够有组织的,使用同一方式的从使用者那里收集资料,因此在设计网站时总是属于“任何状况都能拿来用”的那一类,举例来说,我们发现大概有10000种标记表单的不同方式.好吧,或许没有那么多,但是我们仍能思考几种状况,让使用者易于使用表单结构,同时也便于让网站所有者进行管理，

记表单的方法

方法A:使用表格

Name:

Email:

长久以来许多人都以表格来标记表单,由于使用频率很高的缘故,我们已经习惯于见到表单以这种方式进行排版:左列是向右对齐的文字说明,右列则是相左对齐的表单元素.使用单纯的两列表格,是完成易用表单排版的简单方法之一.

有些人认为不需要表格,也有其他人认为应该把表单视为表状资料.我们不打算支持任何一种说法,但是在某些情况下,使用表格时达成特定表单排版的最佳方法,特别是包含许多种不同元素的复杂表单(使用了单选框,下拉选框等等的表单).完全依赖CSS处理这种表单的排版可能会让人感到挫折,而且经常需要加上额外的与,会比表格耗上更多的标签.

接着看图5-1,这是一般可视化浏览器显示方法A的效果:

图5-1:浏览器显示的方法A的效果

你会发现,使用表格可以把文字说明表单元素排列的十分整齐.然而,对这样简单的表单来说,或许我会避免选择使用表格,并且换用其他不需要使用这么多标签的方法.除非表单的视觉设计十分需要这种排版,否者未必需要使用表格.同时我们也要考虑几个易用性问题,在研究下面两个方法的时候,我们就会接触到这个部分.

方法B:不用表格,但挤在一起

Name:

Email:

使用单一段落和几个

标签隔开所有元素是个可行方法,但视觉上可能会被描绘的有点挤.图5-2十一版浏览器的显示效果:

图5-2:浏览器显示方法B的效果

虽然我们不用表格就能完成排版,但是它看起来有点挤,有点丑.同时我们也遇上表单元素无法完美对齐的问题.

我们能够以CSS为元素加上一个外补丁,以便减轻拥挤的感觉.像是这样:

input{

margin:6px 0;

}

前面这段为每个元素的上下分别加上6像素的外补丁(包含了Name,Email的输入框,以及submit按钮),在元素之间加上额外的空间.就像图5-3一样:

图5-3.方法B在为input元素加上外补丁之后的效果

方法B本身没什么大问题,但是还能进行一些微调,以便把表单做得更好.方法C里头也运用了这些微调技巧,所以一起来看看吧.

方法C:朴素,更容易使用

我喜欢方法C的几个地方.首先,对于类似本示例的单纯表单来说,我发现把每个说明与表单元素放在单独的段落比较方便,不加上样式显示时,段落之间的预设距离应该足以让你轻松阅读内容.稍后我们还能以CSS为表单内包含的

标签设定间隔.

我们甚至更进一步,为表单设定了唯一的id=“thisform”.因此,刚才我提到的精确间隔大致上可以写成这样:

#thisform. p{

margin:6px 0;

}

这代表将这个表单内的

标签的上下外补丁设定为6个像素,覆盖浏览器为一般段落选用的预设值.

方法C与前两种方法的另一个不同之处在于:尽管每个群组(说明和输入框)都放在

里头,我们仍以

把他们放在独立的一行.使用

分开每个元素,就能绕过文字长短不一,造成输入项无法完美对齐的问题.

图5-4是一般浏览器显示方法C的效果,这边有使用先前为

标签设定的样式.

图5-4.浏览器显示方法C的效果,有对P标签使用CSS

除了方法C的视觉效果之外,最重要的优点:也就是提升易用性的部分.

使用

第二步则是为

举例来说.在方法C里面,以

为什么要用?

或许听过其他人说你应该在表单内加上

建立label / ID的关联能让屏幕阅读器为每个表单元素读出正确的标签,而不收版面排列方法的影响,这是件好事.同时,

在处理单选,多选框时使用

举例来说,如果为表单加上一个多选框,让使用者能够选择“记下这些信息”,那么我们就能像这样的使用

借着以这种方式标记多选框,可以获得两个好处:屏幕阅读器能读出正确的说明文字(就像这个例子一样,文字出现在输入框之后也行),而且能切换多选框的范围变大了,现在切换范围除了多选框本身之外,文字部分也包含在内(大多数浏览器都支持).

图5-5就是这个表单在浏览器中的显示效果.我们特别标示了加大之后的多选框切换范围:

图5-5.把文字包含在切换范围内的多选框

除了表单与段落之外,最后我还想展示另一个标记表单的方式,使用定义清单.

方法D:定义一个表单

                       

最后讨论的表单排版方法,是以定义清单定义每一组说明文字与输入框.这是有点争议的方法.我们在定义清单的原始设计目的的边缘游走,不过这是在近期逐渐普及的方法,同时也只得本书一提.

本书稍后在第8章回深入讨论定义清单.事实上,它们能应用的范围远超过大多是设计师的认知:以

排版表单就是个很棒的例子.    你应该发现了这个范围里面的每组表单说明文字都放在定义名词标签之内,随后跟着放在定义描述标签中的表单元素.这么做能将说明文字与表单元素对配起来,并且在不使用任何样式时以浏览器显示的效果见图5-6:

图5-6.以清单定义排版表单的显示效果

根据预设值,大多数可视化浏览器会把缩进显示在单独一行之内.太棒了,因为这样便不必使用任何多余的

或

标签了就能让不支持CSS的浏览器显示出容易使用的表单排版效果.

定义样式

最简单的样式修改,大概是去掉表单内元素的预设缩进:

form. dd{

margin:0;

}

前面这一小段css会使方法D范例显示成图5-7:

图5-7. 去掉缩进效果的定义清单式表单排版

方法A的表格效果,也能借着浮动表单内的元素达成:

form. dd {

margin: 0;

}

form. dt {

float: left;

padding-right: 10px;

}

在把元素浮动到左边之后,包含在之内的表单元素就会排列到右侧,像是图5-8这样.你应该已经发现表单元素不会完美的对齐,但这至少说明了使用标签排版表单时,并不代表必须将每个元素都单独显示在一行里.

图5-8.浮动元件之后的表单排版

事实上,由于多了

和元素,再加上表单内原本就具备的

概要

看完四种标记同一个简单表单的不同方法,同时也讨论了彼此的优缺点,要注意的是,我们为方法C与方法D加上了易用性功能,当然也可以加到头两个方法上,在得到这些改进之后,这两个方法当然也会变得更棒.

这几个方法没有哪一个明显比其他方法要好,或者能当作“最佳解决方案”.不过多知道几种方法很有价值.而你也以组合这四种方法,在你的项目里做出更棒的表单.

方法A:

以视觉效果来说,是个建立表单元素,说明文字的简介方式,在处理复杂,庞大的表单时尤其好用.

然而,为了这样单纯的表单使用表格,似乎太麻烦了.

方法B:

简单的标记法在文字浏览器,小屏幕设备上的显示效果不错.

以视觉效果来说,只用

会让排版变得太拥挤.

方法C:

简单的标记法在文字浏览器,小屏幕设备上显示效果不错.

允许说明文字,表单元素的长度变化,不会有对齐的问题.

包含重要的易用性功能(也能使用在先前的方法内).

方法D:

结构化标记法在文字浏览器,小屏幕设备上显示效果不错.

包含重要的易用性功能(也能应用在先前的方法内).

说明文字与表单元素能以CSS指定要放在同一行之内,或是分行摆放.

当你使用方法A或方法B的时候不必感到内疚,但是学会方法C的优点,并且把它应用到先前的例子里仍然不错.

方法C也有进步的空间,而我们也将在“技巧延伸”这个单元内看到几个我们能加上的额外功能.我们也会讨论一些简单的CSS样式.让我们把表单修饰得更吸引人.

技巧延伸

在这个单元中,我们会先讨论tabindex和accesskey属性,看看它们如何使表单变得更加容易浏览.我们也会研究能帮助组织表单区域的

标签,最后,我们会看一些CSS,因为它能把表单外观修饰得更漂亮.

神奇的tabindex：

我们能轻易加上的功能之一是tabindex属性.加上tabindex,为它指定一个数值之后,使用者就能以键盘切换正在使用的表单元素(通常是Tab键).按下Tab就会依照我们所制定的顺序跳到下一个表单元素.根据预设值,每个能互动的元素都隐含有tabindex,但使用tabindex能收回浏览器指派的顺序,让你完全掌握控制权.

举例来说,让我们为先前的示例(方法C)里面的表单元素加上tabindex属性:

现在,当使用者在表单内切换输入框的时候,我们能确定切换的顺序与我们期望的顺序完全相同:Name,Email,Remenber this info与submit按钮.

在设计复杂,单一行有许多输入框或者其他表单元素的表单时,使用tabindex设定切换顺序的优点就显而易见了.

为何指定切换顺序?

除了在我们表单上实施非常简单之外,还能再次帮助到行动受限的使用者,使其能完全以键盘浏览表单内容.他们不需要抓起鼠标点击每个部分,只需要用Tab键就能依照正确的顺序遍历每个表单元素.请为那些无法同时使用双手浏览网页的人想想,这真的很有帮助.

为频繁使用的表单指定快捷键

与tabindex类似的.accesskey属性是另一个容易加上的功能,不仅能帮助行动受限的使用者,对其他人来说也是方便极了.

举例来说,如果为表单内包围着Name:的

我们来看看达成这个效果所需要的代码:

使用者必须在按下9这个按键的时候同时按下Alt或Ctrl键,根据系统而定,之后光标就会立刻移到Name:的输入框里头.

容易使用的搜索框

在设计会经常使用的表单时(比如搜索框,用户登录等等),加上accesskey属性格外有用,使用者不必伸手去拿鼠标,就能使用键盘立刻切换到适合的位置,开始进行输入.

有件事必须留意,虽然不是所有浏览器都支持accesskey,但是加上这个属性对支持的浏览器使用这很有帮助,举例来说,要是我们加上accesskey=“9”的搜索位置时,windows使用者可以按Alt+9,而Mac使用者则能以Command+9直接切换到搜索输入框内了.

为表单加上样式

现在有了结构完善的表单,接着让我们研究一些能够用来自定显示效果的CSS技巧吧!

设定文字输入框的宽度：

处理表单元素需要技巧,因为它们的宽度,高度与浏览器种类有关.在表单示例中,我们没有指定文字输入框的宽度,让浏览器自动使用预设值,一般来说,设计者或许会以size属性为元素指定宽度,像这样:

把大小指定为20代表将文字输入框的宽度设置为20字元(而不是像素).根据浏览器的预设表单字体,实际的输入框像素宽度可能会有差异.这使得精确指定表单排版变得有点困难.

如果需要的话,我们能借着CSS以像素为单位控制输入框(以及其他表单元素)的宽度.举例来说,让我们把示例表单中的所有元素宽度设定成200像素,我们会利用为表单指定id属性,在这个示例中是thisform.

#thisform. input {

width: 200px;

}

这时,所有在#thisform内的元素都会变成200像素宽.图5-9是可视化浏览器的显示效果.

图5-9 把所有元件宽度设置成200像素之后的效果

哦喔~多选框和submit按钮也是元素,因此得到了相同的设定值,让我们改以id指定Name和Email输入框,而不是一次设定所有的元素的宽度:

#name, #email {

width: 200px;

}

图5-10是以浏览器检查修正后成果的效果,这时只有两个文字输入框是200像素宽的了.

图5-10.只有文字输入框是200像素宽的效果

使用

我们有几种不同的方法能够调整表单内文字的大小,字体与色彩,我们再度奉行“利用你使用的标签”哲学,直接以

我喜欢以

#thisform. p {

font-family: Verdana, sans-serif;

font-size: 12px;

font-weight: bold;

color: #66000;

}

这会使表单内的所有段落文字使用粗糙,酒红色的Verdana 12像素大小的字体.但是同样的结果也能借着为表单内的

#thisform. label {

font-family: Verdana, sans-serif;

font-size: 12px;

font-weight: bold;

color: #66000;

}

这个样式的显示效果见图5-11.

图5-11.为label指定样式的效果

为什么我比较喜欢这个方法?假设除了说明文字之外,表单还有其他放在

当中的指示或文字内容.那么在前一种方法内,这些文字就会使用和

相同的样式设定了.

也能先为表单中的所有文字制定一种样式,接着再为

使用的CSS大概类似这样:

#thisform. {

font-family: Georgia, serif;

font-size: 12px;

color: #999;

}

#thisform. label {

font-family: Verdana, sans-serif;

font-weight: bold;

color: #660000;

}

不需要多余的代码

或许你或发现,在#thisform. label 的定义中没有重复font-size:12px;由于

想象你设计了一个网站,全部使用了Georgia字体,最初你在20个不同的规则中分别加上相同的font-face:Georgia,serif;规则,过了一星期后,老板跑来找你并且对你说“CEO现在讨厌serif字体了,把网站内容改用Verdana”.这时你的钻进这20条规则里,慢慢修改了.

或者是,你也能在更高层级设定一次这条规则,比如说指定在元素里,此时整份文档都汇继承Georgia字体,除非以其他规则指定另外的设定值.现在,当老板要求你进行修改时,你就能回答“没问题,两分钟之后搞定”;或者是能把简易性留给自己,告诉他这需要耗上两个小时,然后用这些额外的时间上eBay标东西.

OK,当然,你应该告诉老板真相,他们应该知道你的价值,为公司节省时间并且善用你找到的新解法.

以

制作表单元素群组

使用

是个为表单元素分组的便利方法.除此之外,加上叙述用的
则会在大多数浏览器内,为你做好的表单元素群组加上一个漂亮的边框.我刚刚有说“漂亮”吗?嗯,我的确喜欢这种边框.而我们只需要用上一点CSS,就能使它变得更加迷人.

首先,来看看建立群组是需要哪些标签.接着为示例表单加上一个群组:

Sign In

图5-12是浏览器显示这个群组的效果图,包含刚加上的

与
标签,以及刚为里面的所有表单元素之外,同时的内容断开了左上方的边线.

图5-12.加上

与之后的表单

我说这个效果“漂亮”的原因是:完全不加上CSS,使用它们的预设样式,它的显示效果的确让人相当感动.同时还能加上一些自定属性,使它变得更有趣,我们马上动手.

你应该也能看出

在为表单隔出不同区块的时候十分有用,举例来说,如果我们的示例是个大表单的第一部分,那么以从视觉上隔开这些区块的话,不仅语义更清楚,还能使表单结构更明显,更容易阅读使用.

为

和加上样式

我们能使用CSS改写

预设边框与文字的样式,与定义其他元素的样式一样简单,首先,我们来修改边框的颜色和宽度,接着再修改文字本身.

为了使

的边线变得更加细致,我们使用以下的CSS:

#thisform. {

font-family: Georgia, serif;

font-size: 12px;

color: #999;

}

#thisform. label {

font-family: Verdana, sans-serif;

font-weight: bold;

color: #660000;

}

#thisform. fieldset {

border: 1px solid #ccc;

padding: 0 20px;

}

接着为左右两边指定20像素的外补丁,并且去掉上下外补丁,为什么要去掉这些外补丁?因为我们的表单说明文字,表单元素都放在

标签内,因此他们在上下方向上已经留足了边界空白.

图5-13是指定这些样式之后的表单显示效果.

图5-13.为

指定样式之后的效果

立体的

最后,为

标签指定一些样式,做出立体的边线效果,让它看起来像是与元素的边线连在一起.

#thisform. {

font-family: Georgia, serif;

font-size: 12px;

color: #999;

}

#thisform. label {

font-family: Verdana, sans-serif;

font-weight: bold;

color: #660000;

}

#thisform. fieldset {

border: 1px solid #ccc;

padding: 0 20px;

}

#thisform. legend {

font-family: arial, sans-serif;

font-weight: bold;

font-size: 90%;

color: #666;

background: #eee;

border: 1px solid #ccc;

border-bottom-color: #999;

border-right-color: #999;

padding: 4px 8px;

}

如你所见,这里做了几件事,首先,调整了

的字体,粗细与大小,接着产生了立体效果,把背景设为浅灰色,然后在整个的外面加上配合边线颜色的单像素边线,为了达成阴影效果,我们还把底部与右侧的边线颜色换成深一点的灰色.

字体大小百分比: 由于我们之前为整个#thisform. 的字体设置为font-size:12px;因此要缩小文字时,我们直接用百分比,在较高层级指定字体大小,接着在底层使用百分比,能够减轻未来的维护负担.要调大整个网站的字体大小么?只要修改一个地方,所有百分比都会随之改变.事实上,最理想的状况下,我们可以设定的初始字型大小,然后在其他所有地方使用百分比.然而在这个示例中,我们选择在层级指定字体大小.

然后调整内部定,以便文字与边线之间留下一点空间.就是这样了!图5-14显示的是最后结果,加上本章内的所有CSS代码,同时仍然使用最简洁,灵活的表单结构.

图5-14 完成的表单示例,以CSS设定样式.

结论

标记表单有许多方法,不管你使用表格,定义清单,还是最基本的段落标签进行说明,表单元素的排版,都要记住,本章讨论的易用性功能,可以轻易加到任何方法里面.

像是tabindex与accesskey这种属性可以提升浏览效率,而

基于短小简介的修改,就能得到更好的结果.

来自：www.blueidea/tech/web/2008/5831.asp译者：zhaozy 小宁

点击看大图

篇6：标准化设计解决方案 Part 1: 从标记语法谈起 Chapter 2 标题网页设计

未必一定是占据了半块屏幕的庞然大物,稍后,我会示范如何简单的用css样式来定义标题标签,以此来帮助你克服对

的恐惧.

对搜索引擎的友好

这是最大的优点.搜索引擎十分喜欢标题标签,标签或者段落中的粗体对搜索引擎来说并没有多大意义,使用正确的

~

标记标题花不了多少时间,但是却能帮助搜索引擎为你的页面建立索引,让用户更容易找到你的网页.

搜索引擎的机器人非常重视标题标签中的内容,或许,你会想要在里面堆上几个关键字,在他们处理完和标签之后,紧接着就会处理页面内容中的标题标签,如果你的页面上没有使用标题标签的话,那这些在你的标题中的关键字不会引起他们的重视,被他们忽略.

所以,只需要花少少的时间,就能让其他人更容易通过内容找到你的网页,听起来不错,对吧?

附带一提的标签顺序

在上面的示例中,在页面中最重要的就是标题,因为他是整个文档的标题,因此,我们将使用最重要的标题标签

,根据W3C,有些人认为跳过标题层并不是什么好习惯,举例说明,假设我们有下面这么一份网页:

Super Cool Page Title

那么下一个标题(如果不是另一个

的话),就应该是

篇7：标准化设计解决方案 Part 1: 从标记语法谈起 Chapter 2 标题网页设计

等等,你也许不会跳过某级标题,比如说在

之后直接使用

.我比较赞同,并且认为结构和纲要相同,应该按照顺序使用每个级层,这能让你为已经存在的页面方便的添加标题,样式.同时这样也比较不会出现用完所有标题级层的情况.

如同先前所述,设计者可能会使用

代表页面里最重要的标题,只因为它的预设字体大小不如

那样大的恐怖.但是要记住,先写结构,再调整样式,我们可以在任何时候根据我们自己的喜好通过css改变标题标签的字体大小.

概要

让我们大致上回顾一下,为什么使用标题标签(

到

)来标记页面内的标题会比较好.

方法A:

可视化浏览器会在禁用或不支持css功能时,以一般文字相同的样式显示标题,非视觉浏览器则完全不知道标题和内文文字之间的差别.

搜索引擎不会特别重视以标记的标题

我们能制定独特的样式,但是我们在新增标题时,却会被heading类困死.

方法B:

可视化浏览器只会用粗体显示内容,继续使用预设的字体大小.

我们无法为标题加上和内文不同的独特样式

搜索引擎同样不会特别重视以

创建的标题的内容.

方法C:

传达了标题标签中的文字确切的含义.

不管是可视化还是非可视化浏览器不管读到什么样式都会正确的处理标题内容

搜索引擎会重视标题标签中的关键字.

技巧延伸

这里我们将采用方法C,并用它来实验一些简单的css样式.我们将完全发挥标题标签独特性的优势.我们可以非常安心的使用标题标签,因为不管在什么浏览器和设备上,都能正确的处理标题内容.接下来我们来给他装扮装扮,然后带它上街(如果你能够带着一个html标签上街的话....)

简单的样式

使用css,最简单最容易实现的效果就是为标题设置不同的字型.我们可以编写一个css规则,然后套用到页面中所有的

标签上(如果你用到了外部样式表,那就可以把样式套用到整个网站上).如果在稍后的时间里想要改变整个网站里每个

的颜色,大小或者字体,那么只需要修改几条css规则就行了,而且修改之后的效果能够马上看到!这听起来很诱人,对吧?

让我们超级酷的标题来告诉我们自己吧:

Super Cool Page Title

让我们用css来改变它的颜色,字体和大小吧:

h1 {

font-family: Arial, sans-serif;

font-size: 24px;

color: #369;

}

就像我们刚才所说的,非常简单,整个页面的所有

都被设置成24像素大小,蓝色的Arial(或者默认的sans-serif)字体,如图 2-2:

图 2-2: 标题样式示例

接下来我们继续在标题文字下面加上1像素宽的灰色边框(如图 2-3):

h1 {

font-family: Arial, sans-serif;

font-size: 24px;

color: #369;

padding-bottom: 4px;

border-bottom: 1px solid #999;

}

图 2-3:加上灰色底边的标题样式示例

我们在文字底部多留了些内补丁,使得下面的边线不至于呼吸困难.因为标题标签是块级元素,因此边框会不止填满文字底部,还会继续向右边延伸,直到填满整个页面宽度.

另外值得一提的是,我们使用了边框的简写法 — 就是在一条声明中同时定义了宽度,样式,颜色.你可以试试看其他的设定值,看看有什么别的效果.

加上背景

背景能给标题加上精巧的效果.只要加上背景色与一些留白,不需要用到图片我们就可以创造出清新的标题风格.举例来说:

h1 {

font-family: Arial, sans-serif;

font-size: 24px;

color: #fff;

padding: 4px;

background-color: #696;

}

我们把标题中的文字变成白色,周围留出4像素的内补丁空间,同时把背景改成绿色.如图2-4那样,会有一条宽大的,颜色如同撞球桌的绿带贯穿整个页面,分割两个段落.

图2-4:设定了内补丁和背景色的标题示例

背景和边框

只要在标题下面加上一条细边框,再配上浅色背景,你就能不用一张图片的情况下做出三维的效果.

这份css与上面的十分类似,只改了几个颜色,在底部加上了2像素的边框

h1 {

font-family: Arial, sans-serif;

font-size: 24px;

color: #666;

padding: 4px;

background-color: #ddd;

border-bottom: 2px solid #ccc;

}

借着使用不同亮度的相同颜色,就能做出如图2-5般逼真的三维效果:

图2-5:设定背景和底边的标题

平铺背景

用上图片的话,就能发挥更多的创意了.就让我们用photoshop创建一个10X10的小图片,最上面是黑色的边框,然后下面是从上到下的灰色梯度(如图2-6):

图2-6 用Photoshop创建的小图片

我们可以用css把这个小图片放到我们的

底部去:

h1 {

font-family: Arial, sans-serif;

font-size: 24px;

color: #369;

padding-bottom: 14px;

background: url(10x10.gif) repeat-x bottom;

}

设定 repeat-x 使浏览器在平铺背景图的时候只在水平方向上排列(相对的repeat-y就是在垂直方向上排列),同时我们设定了将图片放置在标题的底部,并加上一些下部内补丁,以便调整图片和标图文字之间的距离(如图2-7)

图2-7:设定平铺背景的标题示例

方便替换的图标

我们也可以使用cssdebackground属性来设定放在文字左边的小图标以此来代替写死图片标签的方法,为标题加上装饰用的小图标.这个方法能使在未来的日子里改变网站显示效果的工作变得十分轻松—只需要替换那么一个css规则,就能同时改变整个网站的显示效果.

代码和上面的平铺背景大致相同:

h1 {

font-family: Arial, sans-serif;

font-size: 24px;

color: #369;

padding-left: 30px;

background: url(icon.gif) no-repeat 0 50%;

}

我们在文字的左边多留出一块空间以便防止我们想要的图标,然后设定no-repeat指定背景图片不进行平铺(如图2-8),同时我们希望图标的位置在据左边0像素,并且对起垂直中线.

图2-8:设定了图标的标题示例

容易更新

让我们设想这样一个场景:在一个包含了100个页面的网站里,我们没有使用上面的方法,而使用标签写死每个标题旁边的图标,图标和网站风格是相融合的,几个星期后,网站的主人打算换掉网站风格,而新的图标大小和旧的并不一样,哎呦!这下我们就得回去修改整整100份页面里面的标签以更新新图标的路径,真讨厌!想想这些事件会对项目预算造成怎样的影响,对完工期限带来多大的压力?时间就是金钱啊!

如果把这些并不十分重要的,装饰性的图标整合到一个css文件中,只要花上几分钟就能够一次性换掉整站的所有图标,带来崭新的外观!由此你应该可以渐渐明白到结构标记和显示效果分离的好处了吧.

变色龙效果

下来的技巧和我刚才所说的有一些矛盾,但是我认为这个技巧在某些情况下是十分有用的.这是我在2003年4月为Fast Company杂志的网站(www.fastcompany)做标准重构时大量使用的技巧.

那时我们在网站里的

标签旁边用了许多13X13的小图标,就像这样:

FIRST IMPRESSION

有两个让我们决定要这样把图标写死在网页里面.首先,根据标题种类的不同,我们会使用到不同的图标(图书俱乐部是一本书,每日引言则是引号等等),第二个理由则是我们每个月会更换一次整个网站的配色,以配合当期杂志的封面主题.当然,这种替换工作因为使用了css而变得十分简单.

为了让图标跟着其他页面元素一起变色(这样才不必一直为了新色彩而重新制作图标),我们只用两种颜色做了一组图标:白色和透明(会显示除每次更改的背景颜色).图2-9就是放在首页引言之前的图标:

图2-9: 13X13的透明图标(放大后)

为了在透明部分填进颜色,我们使用了简单的css的background属性设定颜色,我们希望只希望这个颜色出现在图表的后面而不出现在标题文字后面,我们用到了css选择器只对

标签内的图片使用这条规则,以便达到我们想要的效果:

h3 img {

background: #696;

}

这段css代码表示

标签内的所有标签都把背景设为绿色,背景色会透过透明像素显示出来,但是白色部分仍然还是白色,如此一来,每个月只需要修改这条css规则,换上不同的颜色,就能瞬间改变网站上每个图标的色彩了,就像变魔术一样.

对齐标签

为了使图标和文字正确的对齐(我们希望垂直居中),因此我们加上了这条css规则:

h3 img {

background: #696;

vertical-align: middle;

}

这条规则会使图标和

文字内容垂直居中,图2-20就是设定玩的标题:

图2-10:以css为图标加上背景色的示例

这个例子还能说明另一个重要的概念—以css指定背景色彩会出现在任何页面内指定的图标或是css图标后面.

举例来说,我们回头看看“方便更新的图标”这个示例,为它加上背景色看看:

h1 {

font-family: Arial, sans-serif;

font-size: 24px;

color: #fff;

padding-left: 30px;

background: #696 url(transparent_icon.gif) no-repeat 0 50%;

}

如此以来 transparent_icon.gif 会显示在相同规则中稍早定义的背景色之上(如图2-11) —在这个例子中,背景色是#696,也就是撞球桌的绿色.

图2-11 设定了背景图,背景色的标题示例

当你为了考虑色彩为主的页面上加小圆角,装饰图标时,这个小技巧就十分好用了.这些不重的图片可以完全放进css文件里面,未来打算更新的时候也就可以轻松替换.现在多用点心思.就能节省未来许多的工作.

总结

我希望通过比较集中常用的方法后,你能发觉正确使用标题标签的好处.不管是视觉,非视觉浏览器或者其他设备,都能正确的历届标题的含义,并且以适当的方法展现它们,搜索引擎也会为他们建立索引,你也可以轻松的以css应用和修改需要显示的效果.

来自：www.blueidea/tech/web/2008/5666.asp译者：zhaozy 小宁

点击看大图

更多推荐

语法描写框架及术语的标记