浏览模式: 标准 | 列表全部文章

XHTML+CSS=网站重构

Submitted by on 2005, October 10, 12:16 AM

一，什么是WEB标准？ 
WEB标准不是某一个标准，而是一系列标准的集合。网页主要由三部分组成：结构（Structure）、表现（Presentation）和行为（Behavior）。对应的标准也分三方面：结构化标准语言主要包括XHTML和XML，表现标准语言主要包括CSS，行为标准主要包括对象模型（如W3C DOM）、ECMAScript等。这些标准大部分由W3C起草和发布，也有一些是其他标准组织制订的标准，比如ECMA（European Computer Manufacturers Association）的ECMAScript标准。我们来简单了解一下这些标准：

1．结构标准语言

（1）XML 

XML是The Extensible Markup Language(可扩展标识语言)的简写。目前推荐遵循的是W3C于2000年10月6日发布的XML1.0，参考（ http://www.w3.org/TR/2000/REC-XML-20001006 ）。和HTML一样，XML同样来源于SGML，但XML是一种能定义其他语言的语。XML最初设计的目的是弥补HTML的不足，以强大的扩展性满足网络信息发布的需要，后来逐渐用于网络数据的转换和描述。关于XML的好处和技术规范细节这里就不多说了，网上有很多资料，也有很多书籍可以参考。

（2）XHTML 

XHTML是The Extensible HyperText Markup Language可扩展标识语言的缩写。目前推荐遵循的是W3C于2000年1月26日推荐XML1.0（参考 http://www.w3.org/TR/xhtml1 ）。XML虽然数据转换能力强大，完全可以替代HTML，但面对成千上万已有的站点，直接采用XML还为时过早。因此，我们在HTML4.0的基础上，用XML的规则对其进行扩展，得到了XHTML。简单的说，建立XHTML的目的就是实现HTML向XML的过渡。

2. 表现标准语言

CSS是Cascading Style Sheets层叠样式表的缩写。目前推荐遵循的是W3C于1998年5月12日推荐CSS2（参考 http://www.w3.org/TR/CSS2/ ）。W3C创建CSS标准的目的是以CSS取代HTML表格式布局、帧和其他表现的语言。纯CSS布局与结构式XHTML相结合能帮助设计师分离外观与结构，使站点的访问及维护更加容易。

3.行为标准

（1）DOM

DOM是Document Object Model文档对象模型的缩写。根据W3C DOM规范（ http://www.w3.org/DOM/ ），DOM是一种与浏览器，平台，语言的接口，使得你可以访问页面其他的标准组件。简单理解，DOM解决了Netscaped的Javascript和Microsoft的Jscript之间的冲突，给予web设计师和开发者一个标准的方法，让他们来访问他们站点中的数据、脚本和表现层对像。

(2) ECMAScript

ECMAScript是ECMA(European Computer Manufacturers Association)制定的标准脚本语言（JAVAScript）。目前推荐遵循的是ECMAScript 262（ http://www.ecma.ch/ecma1/STAND/ECMA-262.HTM ）。

二、为什么要建立网站标准？

我们大部分人都有深刻体验，每当主流浏览器版本的升级，我们刚建立的网站就可能变得过时，我们就需要升级或者重新建造一遍网站。例如1996-1999年典型的"浏览器大战"，为了兼容Netscape和IE，网站不得不为这两种浏览器写不同的代码。同样的，每当新的网络技术和交互设备的出现，我们也需要制作一个新版本来支持这种新技术或新设备，例如支持手机上网的WAP技术。类似的问题举不胜举：网站代码臃肿、繁杂浪费了我们大量的带宽；针对某种浏览器的DHTML特效，屏蔽了部分潜在的客户；不易用的代码，残障人士无法浏览网站等等。这是一种恶性循环，是一种巨大的浪费。

如何解决这些问题呢？有识之士早已开始思考，需要建立一种普遍认同的标准来结束这种无序和混乱。商业公司(Netscape、Microsoft等)也终于认识到统一标准的好处，因此在W3C（W3C.org）的组织下，网站标准开始被建立（1998年2月10日发布XML1.0为标志），并在网站标准组织（webstandards.org）的督促下推广执行。

简单说，网站标准的目的就是：

提供最多利益给最多的网站用户 
确保任何网站文挡都能够长期有效 
简化代码、降低建设成本 
让网站更容易使用，能适应更多不同用户和更多网路设备 
当浏览器版本更新，或者出现新的网络交互设备时，确保所有应用能够继续正确执行。 
对于网站设计和开发人员来说，遵循网站标准就是使用标准；对于你的网站用户来说，网站标准就是最佳体验。

三、采用网站标准有什么好处？

对网站浏览者的好处：

文件下载与页面显示速度更快； 
内容能被更多的用户所访问（包括失明、视弱、色盲等残障人士）； 
内容能被更广泛的设备所访问（包括屏幕阅读机、手持设备、搜索机器人、打印机、电冰箱等等） 
用户能够通过样式选择定制自己的表现界面 
所有页面都能提供适于打印的版本 

对网站所有者的好处：

更少的代码和组件，容易维护 
带宽要求降低（代码更简洁），成本降低。举个例子：当 ESPN.com 使用 CSS改版后，每天节约超过两兆字节（terabytes）的带宽。 
更容易被搜寻引擎搜索到 
改版方便，不需要变动页面内容 
提供打印版本而不需要复制内容 
提高网站易用性。在美国，有严格的法律条款（Section 508）来约束政府网站必须达到一定的易用性，其他国家也有类似的要求。 

四、怎么改善现有网站？

我们大部分的设计师依旧在采用传统的表格布局、表现与结构混杂在一起的方式来建立网站。学习使用XHTML+CSS的方法需要一个过程，使现有网站符合网站标准也不可能一步到位。最好的方法是循序渐进，分阶段来逐步达到完全符合网站标准的目标。如果你是新手，或者对代码不是很熟悉，也可以采用遵循标准的编辑工具，例如Dreamweaver MX 2004，它是目前支持CSS标准最完善的工具。

1．初级改善

为页面添加正确的DOCTYPE 

很多设计师和开发者都不知道什么是DOCTYPE，DOCTYPE有什么用。DOCTYPE是document type的简写。主要用来说明你用的XHTML或者HTML是什么版本。浏览器根据你DOCTYPE定义的DTD(文档类型定义)来解释页面代码。所以，如果你不注意设置了错误的DOCTYPE，结果会让你大吃一惊。XHTML1.0提供了三种DOCTYPE可选择：

(1)过渡型（Transitional ）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1 /DTD/xhtml1-transitional.dtd"> 

(2)严格型（Strict ）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1 /DTD/xhtml1-strict.dtd"> 

(3)框架型（Frameset ）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1 /DTD/xhtml1-frameset.dtd"> 

对于我们初级改善来说，只要选用过渡型的声明就可以了。它依然可以兼容你的表格布局、表现标识等，不至于让你觉得变化太大，难以掌握。

Tip:你懒得输入上面过渡型代码的话，可以访问 http://www.macromedia.com/ 网站的首页，然后查看源代码，把head区同样的代码拷贝粘贴就可以了。

设定一个名字空间（Namespace） 

直接在DOCTYPE声明后面添加如下代码：

<html XMLns="http://www.w3.org/1999/xhtml"> 

一个namespace是收集元素类型和属性名字的一个详细的DTD，namespace声明允许你通过一个在线地址指向来识别你的namespace。只要照样输入代码就可以。

声明你的编码语言 

为了被浏览器正确解释和通过标识校验，所有的XHTML文档都必须声明它们所使用的编码语言。代码如下：

<meta http-equiv="Content-Type" content="text/html; charset=GB2312" /> 

这里声明的编码语言是简体中文GB2312，你如果需要制作繁体内容，可以定义为BIG5。

用小写字母书写所有的标签 

XML对大小写是敏感的，所以，XHTML也是大小写有区别的。所有的XHTML元素和属性的名字都必须使用小写。否则你的文档将被W3C校验认为是无效的。例如下面的代码是不正确的：

<TITLE>公司简介</TITLE> 

正确的写法是：

<title>公司简介</title> 同样的，<P>改成<p>，<B>改成<b>等等。这步转换很简单。 

为图片添加 alt 属性 

为所有图片添加alt属性。alt属性指定了当图片不能显示的时候就显示供替换文本，这样做对正常用户可有可无，但对纯文本浏览器和使用屏幕阅读机的用户来说是至关重要的。只有添加了alt属性，代码才会被W3C正确性校验通过。注意的是我们要添加有意义的alt属性，象下面这样的写法毫无意义：

<img src="/logo_unc_120x30.gif" alt="logo_unc_120x30.gif"> 

正确的写法：

<img src="/logo_unc_120x30.gif" alt="UNC公司标志，点击返回首页"> 

给所有属性值加引号 

在HTML中，你可以不需要给属性值加引号，但是在XHTML中，它们必须被加引号。

例：height="100"，而不能是height=100。

关闭所有的标签 

在XHTML中，每一个打开的标签都必须关闭。就象这样：

<p>每一个打开的标签都必须关闭。</p> <b>HTML可以接受不关闭的标，XHTML就不可以。</b> 

这个规则可以避免HTML的混乱和麻烦。举例来说：如果你不关闭图像标签，在一些浏览器中就可能出现CSS显示问题。用这种方法能确保页面和你设计的一样显示。需要说明的是：空标签也要关闭，在标签尾部使用一个正斜杠"/"来关闭它们自己。例如：

<br /> <img src="/webstandards.gif" /> 

经过上述七个规则处理后，页面就基本符合XHTML1.0的要求。但我们还需要校验一下是否真的符合标准了。我们可以利用W3C提供免费校验服务（ http://validator.w3.org/ ）。发现错误后逐个修改。在后面的资源列表中我们也提供了其他校验服务和对校验进行指导的网址，可以作为W3C校验的补充。当最后通过了XHTML验证，恭喜你已经向网站标准迈出了一大步。不是想象中的那么难吧！

2．中级改善

接下来我们的改善主要在结构和表现相分离上，这一步不象第一步那么容易实现，我们需要观念上的转变，以及对CSS2技术的学习和运用。但学习任何新知识都需要花点时间的，不是吗？诀窍在于边做边学。假如你一直采用表格布局，根本没用过 CSS，也不必急于跟表格布局说再见，你可以先用样式表代替 font 标签。随着你学到的越多，你能做的就越多。好，一起来看看我们需要做哪些事：

用CSS定义元素外观

我们在写标识时已经养成习惯，当希望字体大点就用<h1>，希望在前面加个点符号就用<li>。我们总是想<h1>的意思是大的，<li>的意思是圆点，<b>的意思是“加粗文本”。而实际上， <h1>能变成你想要的任何样子，通过CSS，<h1>能变成小的字体，<p>文本能够变成巨大的、粗体的，<li>能够变成一张图片等等。我们不能强迫用结构元素实现表现效果，我们应该使用CSS来确定那些元素的外观。

例如，我们可以使原来默认的6级标题可以看起来大小一样：
h1, h2, h3, h4, h5, h6{ font-family: 宋体, serif; font-size: 12px; } 

用结构化元素代替无意义的垃圾 

许多人可能从来都不知道HTML和XHTML元素设计本意是用来表达结构的。我们很多人已经习惯用元素来控制表现，而不是结构。例如，一段列表内容可能会使用下面这样的标识：

句子一<br /> 句子二<br /> 句子三<br /> 
如果我们采用一个无序列表代替会更好：
<ul> <li>句子一</li> <li>句子二</li> <li>句子三</li> </ul> 
你或许会说“但是<li>显示的是一个圆点，我不想用圆点”。事实上，CSS没有设定元素看起来是什么样子，你完全可以用CSS关掉圆点。

给每个表格和表单加上id 
给表格或表单赋予一个唯一的、结构的标记，例如

<table id="menu"> 

接下来，在书写样式表的时候，你就可以创建一个“menu”的选择器，并且关联一个CSS规则，用来告诉表格单元、文本标签和所有其他元素怎么去显示。这样，不需要对每个%lt;td>标签附带一些多余的、占用带宽的表现层的高、宽、对齐和背景颜色等等属性。只需要一个附着的标记（标记“menu”的id标记），你就可以在一个分离的样式表内为干净的、紧凑的代码标记进行特别的表现层处理。

中级改善我们这里先列主要的三点，但其中包含的内容和知识点非常多，需要我们逐步学习和掌握，直到最后实现完全采用CSS而不才用任何表格实现布局。

系统工程师 | 评论:0 | 阅读:4045

中国大学的100大成功

Submitted by on 2005, October 9, 11:57 PM

杨振宁说中国大学办得很成功，对社会贡献非常大，很多人没觉得我们的大学有那么好，《犯贱报》为此列出中国大学的100大成功，希望你明白。
1、高昂的学费盘活了市场经济；
2、给人特别是穷人们一种追求和信仰；
3、给了富人们一个娱乐和提升自己档次的场所；
4、为有钱人有权人和有名人培养了很多小老婆；
5、发很多张证书，是些很好的纪念品；
6、为社会培养了无数价值小于1000块每月的人才；
7、让学生很快乐地在食堂解决一些过期大米和沙子；
8、让学生消费一些卖不出去的教材；
9、成功地为一些不认识字的金牌运动员、演艺明星安排了读书的机会；
10、成功地给了年轻人无忧无虑地玩四年；
11、学生在学校外租房子盘活房地产；
12、很多学生自杀，一定程度上缓解了人口危机；
13、学生和老师一天可以写一大篇出色的论文；
14、学生知道了怎么考试作弊；
15、外语过了四六级，可以认识老外嫁给老外；
16、学生消费一些了黑心棉，如果不消费，肯定就被白白销毁了；
17、校园里都有小树林，给学生们提供了亲热的好地方；
18、学生们听大学教授的课学习了各地的方言；
19、学生提高了酒量；
20、提高了色胆的胆量；
21、学生们看A片成功性教育；
22、给你机会出国留学刷盘子挣英镑美圆；
23、很多学生自杀，一定程度上缓解了人口危机；
24、还有学生杀同学，又缓解了一点人口危机；
25、让我们实践了什么叫做恋爱，甚至是结婚、生子；
26、让一大群人有又硬又挤的半价火车坐；
27、有一个大学学生证，在夜总会、酒吧身价就是不一样；
28、让我们学会了向家里要钱的手段，以便以后投身直销行业；
29、老师让我们签几个字就成功地提高了就业率；
30、我是一个北京人，大学录取工作很成功；
31、高高的学生公寓，为我们提供了自杀的方便；
32、对中国游戏产业有巨大贡献；
33、写武侠小说写得好就可以当院长；
34、演电影演得好也可以当教授；
35、大学生繁荣了色情网络，也就是繁荣了网络；
36、一年事情干了四年，叫做认真；
37、成功地让大学生成了爱滋病高危人群，培养出的学生勇于承担最高危的事情；
38、四年里见过了一两次伟大的大学校长；
39、导师家省了一个佣人的钱；
40、培养了一大批喝酒泡妞的诗人；
41、还培养了一大批开口就是“体制”的愤青；
42、进去时是男孩女孩，出来就是成熟的男人女人了；
43、给富婆们也找到了爱；
44、在钱面前，大学很公平；
45、成功创造了“勤工俭学”这么伟大的一个词语；
46、在大学里谈恋爱不用负责任；
47、大学不开家长会，而是家长们开会；
48、老乡会又促进了校园周边的经济发展；
49、开始体验中国式关系；
50、成功地读了一些没有用处的东西；
51、常常发一些免费的安全套；
52、可以不知道教室在哪里，只要你知道老师家在哪里就行；
53、我们学会做实验了，比如硫酸泼到熊身上；
54、宿舍里一张小床可以睡下两人，很节约；
55、男学生衣服基本不洗，很节约水；
56、卧谈会解决失眠多梦；
57、白天可以睡个没有打搅的好觉；
58、奖学金可以请客潇洒一顿；
59、大学校园里活跃着芙蓉姐姐；
60、一个中国农民坚持种40年地的理由，要没这个理由，中国大片田地荒芜；
61、“扩招”很好，每个中国人都有交钱的机会；
62、解决一些大龄男教师的婚姻问题；
63、男大学生每天的主要工作就是踢足球吸引女生；
64、女大学生每天的主要工作就是跳健美操吸引老板；
65、毕业了可以杀猪卖肉，吸引眼球生意好；
66、可以和教授亲密接触搞考研试卷；
67、丁俊晖要是读过大学，肯定超过亨德利；
68、和富人有同居的机会；
69、可以看图书馆里又破又旧的小说和崭新的学术书籍；
70、舞会很多，想跳就跳，想怎么样就怎么样；
71、泡妞可以以武力取胜，很公平；
72、干什么都学会了排队，又打发了一段无聊时光；
73、上自习可以两个人抱着一起上；
74、可以在学校里四处写和画，没人管，更没人擦；
75、游泳池里人很多，不怕被淹死；
76、大门都很气派，每次进出趾高气扬，让民工们羡慕去；
77、每换一个校长，教学楼颜色变一次，很好看，很新鲜；
78、学生眼神变得很忧郁，很有气质；
79、老师的讲话很催眠，很好睡觉；
80、大学生一夜情繁荣了第三产业；
81、成功地为很多网友贡献了他们想要的女网友；
82、学校电影院里可以看到很多外面看不到的片子；
83、每学期考试前夕深刻理解突击战；
84、让没事干的学生觉得有事可干；
85、让有事可干的学生又觉得没事干；
86、大学一样要考试，很有竞争性；
87、老师每科都给我60分；
88、朋友很多，男朋友女朋友更多；
89、消费了很多200块拍一集的没人消费的电视连续剧，一天可以消费一部；
90、让一些读了很多书又找不到工作的人当上老师，解决了就业；
91、围绕着大学，成功地诞生了一个又一个的“中国硅谷”；
92、可以写很多很多助学贷款申请，写了很多很多之后，能够得到500块；
93、老师抽签决定考试分数，很公平；
94、培养过的学生勇于致富，不断搞起传销；
95、学会了宽容，学生开始窝藏犯罪；
96、热爱家乡，重点大学在招生上都做到了这一点；
97、学校信誓旦旦地说会有学费减免措施；
98、教学方式很传统，不忘本；
99、枪手帮帮考，形式很活泼；
100、可以考研究生继续交学费、继续以上列举的所有一切。

胡言后乱语 | 评论:0 | 阅读:3658

潸然

Submitted by on 2005, October 9, 11:28 AM

装好了新版本的QQ，出来了卡卡。

是我的QQ宠物，忽然想到以前和朋友的约定。宠物得婚姻。：（

去QQ空间看看，呵呵。感觉很潸然。

原来如此，过客而已。

几天的严重睡眠不足，让身体处在崩溃的边缘。加上感冒，我觉得自己在玩极限。

看了自己的过去，我无语言了。

祝她幸福吧，卡卡，看你害得我。

打完工了就卸载你，免得再次得回忆。

要去睡觉了，实在不行了。

几天没看程序了，做调查报告，做设计。努力ing！

生活在别处 | 评论:0 | 阅读:3482

做网站可能需要注意的地方

Submitted by on 2005, October 8, 5:43 AM

1，对每一个超级链接点击之后采用新开窗口还是直接跳转，必须认真对待。如果用户点击一个link之后是要放弃当前页面开始新的体验，则应用直接跳转。如果用户点击link是要了解更多的信息，但是当前页面的信心仍然有用，则应新开窗口。

2，在每一个用户可能需要帮助的地方提供帮助信息或帮助按钮。完善的帮助系统是一个产品，网站成功很重要的因素。

3，区别对待你用户中的菜鸟和大虾，对于菜鸟有简单易上手的教程和循序引导，对于大虾应有快速开始体验的绿色通道。

4，对每一个功能使用的词语要慎重措辞。易懂，清楚描述提供的功能含义。不要让过于“酷”的词语吓跑用户。

5，是否有良好的快速的Bug反馈机制和投诉渠道，并且对bug与投诉及时反应。不要让这些问题石沉大海，没有回应。同时注意，尽量不要使用email这样的反馈机制，开发一个良好互动的反馈系统是有必要的。让其他用户可以看到另外的用户的提问和解答的情况。

6，了解你的用户群习惯，Office，Windows的操作习惯无疑是他们最熟悉的，所以，Word式的编辑器，Windows式的操作界面对大多数用户来讲往往会是最友好的。当你不清楚的用户的喜好的时候，多搞简短的问卷调查来帮助你改善提高往往是有效的。

7，在适当的时候和地方体现你的幽默是可爱的。用户会对这样的设置会心一笑，无形中增加对你的喜爱，认可度

8，不要轻易对你的用户承诺什么，但是一旦承诺了，就要尽最大努力去兑现。

9，对于由于开发者的粗心或者失误给用户造成的损失和伤害，不要沉默，不要试图去隐瞒否认，而是诚挚道歉，承担责任，解决问题。

10，功能齐全不是最重要的。做好核心功能，对核心功能体验良好是应该优先考虑的。不是你推出的服务越多，用户越喜欢，而是你推出的某项核心服务足够好，吸引了用户。事实上，一个网站理论上可以提供的功能是可以无限增加的。不要忘记了用户来这里的最重要的目的。

11，不要试图在一个还不错的产品里去强行捆绑（并且不可卸载）自己还不够成熟的产品。体验差的产品只会伤害用户，并且使得他们对你今后的改进也会保持一种惯性上的敬而远之。

12，提供信息型的网站是应该让用户获取所需并且快速离开当前板块。

13，在不泄漏商业机密的情况下，让用户知道你的开发进度和目标是值得赞许的。一个和用户足够接近并且亲切的开发团队能够赢得用户的认可。

14，开放的心态尤其重要。让你的用户来去自由，从长远来讲可能反而能够对用户形成最大的粘性。不要像某些SP一样，一旦使用了其服务，就不让你在退订。不要让用户有上了贼船的感觉。

15，粘住用户是我们的最终目的。但是注意途径和方式。说得虚一点：留住用户的心，比留住用户的人更加重要。

16........

最后，纸上谈兵谁都会，说易做难。说一百件，不如做十件，做十件，不如做好一件。

YY完毕。：）

胡言后乱语 | 评论:0 | 阅读:3764

什么是Web2.0？

Submitted by on 2005, October 8, 5:37 AM

Web2.0相关部分社会软件简介：Web2.0是以Flickr、43Things.com等网站为代表，以Blog、TAG、SNS、RSS、wiki等社会软件的应用为核心，依据六度分隔、xml、ajax等新理论和技术实现的互联网新一代模式。”现在给大家介绍一下。
 
    Blog——博客/网志：Blog的全名应该是Web log，后来缩写为Blog。Blog是一个易于使用的网站，您可以在其中迅速发布想法、与他人交流以及从事其他活动。所有这一切都是免费的。 
<IFRAME style="VISIBILITY: hidden" src="http://www.ynet.com/gall/ast.jsp" width=0 scrolling=no height=0></IFRAME><DIV></DIV>    RSS——站点摘要：RSS是站点用来和其他站点之间共享内容的一种简易方式（也叫聚合内容）的技术。最初源自浏览器“新闻频道”的技术，现在通常被用于新闻和其他按顺序排列的网站，例如Blog。 


    WIKI——百科全书：Wiki--一种多人协作的写作工具。Wiki站点可以有多人（甚至任何访问者）维护，每个人都可以发表自己的意见，或者对共同的主题进行扩展或者探讨。

　　Wiki指一种超文本系统。这种超文本系统支持面向社群的协作式写作，同时也包括一组支持这种写作的辅助工具。

    网摘：“网摘”又名“网页书签”，起源于一家叫做Del.icio.us的美国网站自2003年开始提供的一项叫做“社会化书签”（Social Bookmarks）的网络服务，网友们称之为“美味书签”（Delicious在英文中的意思就是“美味的；有趣的”）。 

    SNS——社会网络：Social Network Sofwaret，社会性网络软件，依据六度理论，以认识朋友的朋友为基础，扩展自己的人脉。 

    P2P——对等联网：P2P是peer-to-peer的缩写，peer在英语里有“（地位、能力等）同等者”、“同事”和“伙伴”等意义。这样一来，P2P也就可以理解为“伙伴对伙伴”、“点对点”的意思，或称为对等联网。目前人们认为其在加强网络上人的交流、文件交换、分布计算等方面大有前途。

    IM——即时通讯：即时通讯（Instant Messenger，简称IM）软件可以说是目前我国上网用户使用率最高的软件。聊天一直是网民们上网的主要活动之一，网上聊天的主要工具已经从初期的聊天室、论坛变为以MSN、QQ为代表的即时通讯软件。

系统工程师 | 评论:0 | 阅读:3761

Records:618«‹106107108109110111112113114115›»