关于target="_blank"去留的问题在网上已经被反复争议很多次了。有的说要留，有的说要去掉。主张留的一方主要是考虑到target="_blank"的属性目前来讲还没有一个好的方式来解决，而主张去的一方则拿出了rel与JS的解决方案。target="_blank"是否的存在是否有必要我想目前还有很多正处在一种盲区。我查阅了相关的文献，发现其实情况并非是我们所想的那样，事实上target="_blank"并非是不符合标准的，而用rel与JS的解决方案也是没有必要的，因为这是个误区，只要我们了解了rel与target的真正含义我们就清楚了其实这里本不应存在争议。下面我将我通过查阅文献所得到的知识与大家分享，我们先来了解一下target与rel的含义：

　　target ，允许指定在什么位置显示已经选择的超链接内容。也就是说链接的内容将在什么样的窗口被显示。target 的属性值有四个保留的名称，分别是：_blank,_self,_parent,_top。

　　_blank的意思是浏览器总在一个新打开的、未命名的窗口中载入target＝"_blank"链接的文档。这里大家也许会很不理解“未命名”是什么意思。事实上target 是可以给新打开的窗口赋一个ID，例如：target="name" 这就表明通过target="name"链接载入的文档将会在一个叫"name"的窗口显示。如果没有ID为"name"的窗口，那么浏览器就会新建一个名为"name"的窗口来显示链接文档。如果当前窗口的ID就是"name"那么这个链接文档就会在当前的窗口中替换原有的内容显示出来。

　　_self的意思其实就是当前文档，<a>的默认目标就是_self，这个属性值一般来说是用不到的。

　　_parent是使链接文档在父级窗口显示，这个属性值只在框架结构中使用，如果身本就是顶级框架，那么其作用与_self相同。

　　_top同样是应用在框架中的，但是他的效果是清除框架来显示目标文档。这对于从框架结构转向无框架结构是很有作用的。

　　现在我们知道了，target 是一目标显示的属性与浏览器密切相关的。那么rel又是什么呢， 为什么很多人把他当作是target 的替代属性呢？下面我们就来认识一下rel。其实不只有一个rel还有一个与之对应的属性叫rev，这两个属性的意思分别是：从源文档到目标文档的关系；从目标文档到源文档的关系。这里的源文档可以理解为链接所处在的当前文档，而目标文档也就是这个链接将要打开的文档。这下我们应该清楚了，其实rel与rev是一种文档之前的链接关系，而并非是与浏览器相关的如何显示目标文档的属性。

　　那么rel与rev有哪些关系呢？下面将一一列取并解释其中的含义：

　　next，链接到下一个文档；
　　prev，链接到前一个文档；
　　head，链接到集合中的顶级文档；
　　toc，链接到集合的目录；
　　parent，链接到源上面的文档；
　　Child，链接到源下面的文档；
　　index，链接到此文档的索引；
　　glossary，链接到此文档的术语表；

　　其中next与prev是一组。表明了当前文档与目标文档之前的关系是同级的关系，可以写成这样<a href="movie_002.htm" rel=next rev=prev>。head与toc可以形成一个组合，表示者是由目录链接到最终的文档，或是由文档链接到目录。parent与child是一组，表示着由当前的文档链接到父级文档或是子级文档。而index与glossary可以与head分别组合，形成由文档到索引，或是由索引到文档；文档到术语表或是术语表到文档。

　　也许这样讲可能还是不很清楚，下面举个例子：我这里整理了一个电影文档资源，那么我需要对这些资源进行分类，我把电影分成：武侠片、战争片、爱情片、恐怖片、纪录片。那么我在电影根目录需要链接到下面的子类的时候那么链接的关系应该是：rel=child rev=parent ，而如果当前是武侠片的频道页，我需要转爱情片频道或是其它频道时，那么链接关系就应该是：rel=next rev=prev，当我们由一个武侠片链接到“卧虎藏龙”这部电影的文档时链接的关系应该是：rel=head rev=toc，当由“卧虎藏龙”链接到索引的时候链接关系又变成了：rel=index rev=head。

　　由于目前的CSS还不能抓取rel与rev的属性值，所以没有办法给不同关系的链接提供不同的样式，所以现在rel与rev只是用来使得网页的语义性更为完善。

DIV CSS高级布局已逐渐流行，但面对所谓DIV CSS布局的叫法让人更为担心，不要让DIV成为Table的替代品，多层嵌套的DIV会严重影响代码的可阅读性，活用HTML为我们提供的标签吧。

什么时候应该用DIV?

虽然在这方面没有什么硬性的规定,但个人认为DIV更适用于大体框架的定位.例如我们要定义一块头部的区域,一般会这样定义一个DIV:

<div id="header">这里就是头部框架里要写的内容</div>

当然,可以用class来定义,但一般来讲如不是在同一页面会重复的元素,用id能更好的区别开来.

查看如下定义代码

  <ul id="navbar">
   <li id="articles">
   <a href="/articles/" title="Articles">Articles</a></li>
   <li id="topics">
   <a href="/topics/" title="Topics">Topics</a></li>
   <li id="about">
   <a href="/about/" title="About">About</a></li>
   <li id="contact">
   <a href="/contact/" title="Contact">Contact</a></li>
   <li id="contribute">
   <a href="/contribute/" title="Contribute">Contribute</a></li>
   <li id="feed">
   <a href="/feed/" title="Feed">Feed</a></li>
   </ul>
   <h1 id="masthead">
   <a href="/">
   <img src="/pix/alalogo.gif" alt="A LIST Apart: For People Who Make Websites" />
   </a>
   </h1>  
　<div id="ish">
　<a href="/issues/214" title="Issue 214">No. <em>214</em></a>
　</div>

定义了最上面的导航(ul部分),左边的大logo和那个圆圆的No.xxxx的标记.

他没有使用DIV来做顶部的框架,但却很好的说明了这些代码的用途,为什么?因为他活用了HTML提供的标签,以及样式名称的定义

其它最常用的布局标签

h1
这个标签或许真正会去用的人很少,因为它显示的字体真的是太"大"了,但我们是CSSer,有什么标签样式不能改呢?而且它所能表达的意思就如同它原先的作用一样明显(大标题)我想你已经知道怎么去用它了 ^_^

ul
这个标签很多情况是用来定义导航部分的,当然也可以用ol来代替,但导航连接没有什么顺序之分吧,所以还是用ul来的比较确切(去掉CSS后效果更明显)

b
这个已经不再推荐使用的标签,在布局上却能带来不少的方便(因为短),虽然我不是太赞成使用这个标签,但有些时候(比如细小地方的布局定义)还是不错的选择

h2
h2使用最多的地方应该不是布局上,而是副标题,但有些地方需要定义栏目样式的话,用这个标签比较合适,栏目内容就使用p

浏览器卖主扭曲了标准并且自顾自的不按规则去做一些事，他们可能会造成一些问题，或者至少产生了混淆。例子之一就是一些浏览器处理alt属性（一般会被错误的称作alt标签）的方式，比如拥有大量用户的Windows的IE浏览器。

替换文字（alt text）并不是用来做提示（tool tip），或者更加确切的说，它并不是为图片提供额外说明信息的。相反地，title属性才应该用来为元素提供额外说明信息。这些信息在大部分图像浏览器里显示为提示（tool tip），虽然制造商可以任意采取其他方式渲染title属性的文字。

很多人看来对这两个属性感到迷惑， 所以我写下我的想法，如何去用它们。

alt属性

为不能显示图像、窗体或applets的用户代理（UA），alt属性用来指定替换文字。替换文字的语言由lang属性指定。来源：How to specify alternate text.

Alt属性（注意是“属性”而不是“标签”）包括替换说明，对于图像和图像热点是必须的。它只能用在img、area和input元素中（包括applet元素）。对于input元素，alt属性意在用来替换提交按钮的图片。比如：<input type="image" src="image.gif" alt="Submit" />.

使用alt属性是为了给那些不能看到你文档中图像的浏览者提供文字说明。这包括那些使用本来就不支持图像显示或者图像显示被关闭的浏览器的用户，视觉障碍的用户和使用屏幕阅读器的用户。替换文字是用来替代图像而不是提供额外说明文字的。

在写替换文字前仔细想想，保证那些文字确实为那些看不到图像的人提供了说明信息，并且在上下文中有意义。对于那些装饰性的图片可以使用空的值（alt=""，引号中间没有空格），而不是使用不相关的替换文字比如“blue bullet”或者“spacer.gif”。不要忽略它，如果你忽略了，那么一些屏幕阅读器会直接阅读图像文件的文件名，那些文字浏览器，比如Lynx会显示图像文件的文件名，而那对于你的浏览者就没什么用了。

包含文字的图像图片设置替换文字是最简单的，图像中包含的文字一般来说就可以作为alt属性值。

至于替换文字的长度，看看WCAG 2.0（网站内容可用性指南2.0）是怎么说的：

Alt属性值得长度必须少于100个英文字符或者用户必须保证替换文字尽可能的短。
我把它理解为“尽可能短，尽需要长”。

即使你想让它显示为提示（tool tip），也不要给文字元素使用alt属性，这并不是它的用法。至今据我所知，那样做仅能在Windows的IE浏览器和古老的Netscape 4.*（windows版本）有效。没有一个Mac的浏览器会将它显示为提示（tool tip）。

当浏览器把替换文字显示为提示（tool tip）后，那些错误使用alt属性的行为也受到了鼓励。一些人开始写无意思的替换文字，因为他们趋向于认为它是一个额外的说明信息，而不是不能显示图像的替换。其他人可能不想让提示（tool tip）出现，然后就完全忽略了写alt属性值。这些错误的做法，都给那些不能看到图像的浏览者造成了困难。

额外的说明信息和非本质的信息请使用title属性。

title属性

title属性为设置该属性的元素提供建议性的信息。来源: The title attribute.

title属性可以用在除了base，basefont，head，html，meta，param，script和title之外的所有标签。但是并不是必须的。可能这正是为什么很多人不明白何时使用它。

使用title属性提供非本质的额外信息。大部分的可视化浏览器在鼠标悬浮在特定元素上时显示title文字为提示信息（tool tip），然而这又由制造商来决定如何渲染title文字。一些浏览器会将title文字显示在状态栏里。比如早期版本的Safari浏览器。

title属性有一个很好的用途，即为链接添加描述性文字，特别是当连接本身并不是十分清楚的表达了链接的目的。这样就使得访问者知道那些链接将会带他们到什么地方，他们就不会加载一个可能完全不感兴趣的页面。另外一个潜在的应用就是为图像提供额外的说明信息，比如日期或者其他非本质的信息。

title属性值可以比alt属性值设置的更长。不过要注意的是，有些浏览器会截断过长的文字（比如工具提示或其他）。比如Mozilla核心的浏览器只能显示最先的60个字符。这被认为是一个Mozilla bug，这是你要注意的。

使用前先考虑

我的建议是保证替换文字（alt text）精要。在大多数的应用里，都应该被留白，alt=""（注意两引号中没有空格）。 想想那些图像，为那些浏览者提供了什么样的信息，你应该用什么文字去描述它，或者你该为看不到图像的人提供什么信息？ 将替换文字写成“照片：站在大楼外的CEO，穿着灰色西装和黑色领带，望着天”对于看不到图像的人真的有帮助？如果你觉得是，那么你就写吧。在很多情况下，我觉得让替换文字留白比较好。

对于title属性，比较难于给出严格的使用说明。我大部分用在那些不能自我释意的链接上，比如同一页面上的相同的链接文字，不同的链接页面。有时候也为一些按钮或者表单元素提供更多的说明文字。

更长的描述

当一个图片需要更加长的描述，而超过alt属性的限制，那么还有一些选择。

longdesc属性可以用来提供链接到一个包含图片文字描述的单独页面。这就意味着把浏览者链接到另外的页面，这可能会造成理解上的困难。另外浏览器对于longdesc属性的支持也是不一致的，并且不是非常好。

longdesc属性可以包含一个链接到当前文档的其他部分（锚点）来取代链接到另外的页面。在Accessibility footnotes, Andy Clarke很好的解释说明了如何应用。

描述链接（D links）可以用来补充longdesc。一个描述链接就是一个常规的链接，连接到含有替换文字的页面。该链接被置于图像的旁边，并且在所有浏览器中都是可是的。对于它的有效性人们有很多不同意见，我的个人意见不大喜欢这个注意。WCAG也是，在他们的工作草案HTML Techniques for WCAG 2.0中，描述链接是被“不赞成”的。

如果对图片的长的描述对于任何浏览者都有用，那么你得考虑让它简单的显示在同一个文档里面，而不是链接到其他页面里或者藏起来。这样每个人都可以阅读到。这是一种简单低技术含量的方法。

　　css可以处理16,777,216颜色，可以使用名字、rgb值或十六进制代码。

red红色
等同于
rgb(255,0,0)
等同于
rgb(100%,0%,0%)
等同于
#ff0000
等同于
#f00

　　有17个预先确定的颜色，它们是：

　　aqua, black, blue, fuchsia, gray, green, lime, maroon, navy,

　　olive, orange, purple, red, silver, teal, white, and yellow.

　　transparent 也是一个正确的值。

　　rgb的三个值都是从0到255，0是最低级，255是最高级，这些值同样可以是百分比。

　　我们通常使用10进制即0-9，但hexadecimal使用16进制，即0到f。

　　十六进制三或六个数字长度前面带上#字符，三个长度是六个的压缩形式，比如#f00是ff0000的压缩，#c96是#cc9966。三位数很好理解，像rgb，第一个是红色，第二个是绿色，第三个蓝色。但六位数给于更多的颜色控制。

color和background-color

　　颜色可以使用color和background-color，是美国英语中"color"不是"colour"。

　　蓝色背景，黄色文字：

h1 {
    color: yellow;
    background-color: blue;
}

　　这些颜色可能比较粗糙，你可以使用另外的色度：

body {
    font-size: 0.8em;
    color: navy;
}
h1 {
    color: #ffc;
    background-color: #009;
}

　　你可以看到h1已经变成黄色和蓝色。

　　color和background-color可以使用在绝大部分html元素，包括body。

　　Web用户界面的开发在一个基于web的整体项目中起到至关重要的核心作用。

　　项目能否被客户所接受，70%的重心在于用户界面是否良好或优秀。

　　Web Design并非是一个中学生草草两笔能够负担得起的行当。

　　Web Design并非是一个程序员学习一周html能够胜任的职业。

　　experience   creativity   circumspection   afflauts   techon = web design.

　　使用dw或其他visual tools制作html page可能是designer的必经之路，但也并非100%如此。

　　切勿将visual tools作为designer技术的塔顶。

　　对于xml，我想说的是，作为数据抽象的载体，xml的应用主要不在web设计这一块。

　　xml的作用是在设备之间传递通用格式的数据，从而取代对原有的internet只能传递通用格式的html流的方式，来达到应用程序在internet上无缝结合的目的。

　　对于web设计，xml起到的作用可能是辅助的。

对于dhtml

　　dhtml是动态html，动态并不代表会移动的像素。

　　这里的动态指的是交互。

　　交互是web design与平面设计最主要的设计差别。

　　掌握dhtml的思想是至关重要的。

对于flash

　　flash是一种适用于web的动画设计工具。它可以变得很重要，但也可以一文不值。要根据web主题而定。

　　但有一种情况是可以肯定的：一个网站全部用flash制作是不可取的。

对于图像

　　web页面中尽量避免适用过多的图形，除非处于需求必须这么做。

　　图形是固定的元素，是不易动态改变的。过多的使用图形将大大降低web的灵活性，提高维护的难度。

　　关于图形的使用，可以具体参考ms的主页，它把握得比较得当。

对于声效

　　强制性的不可关闭的音乐播放是不推荐使用的。（比如cruise的主页，不过他的主页音乐比较轻，还可以接受。）

　　推荐使用可开关的音乐的情况：

　　1.音乐相关站点

　　2.特效展示站点

　　3.测试站点

对于gif动画

　　一个页面上过多会重复运动的元素会扰乱观察者的视觉。

　　gif动画运用在一个页面上的数量5个左右为极限。

对于站点目录结构

　　光是给文件夹安排结构和给文件起名就是一件不容忽视的大事。直接关系到日后的站点维护工作。草草了事地安排目录结构会带来灾难性的后果。

　　通常站点目录可以按照文件类型分类，例如图片目录、脚本目录。也可以按照功能分类，例如编辑目录、管理者目录。也可综合性地分类。

　　优秀的目录分类也会给文件的命名带来便利。文件名首先不宜使用中文。其次不宜使用拼音的打头字母组合。文件名在适当的情况下可以写得很长。但目录名应尽量短小简洁。

对于操作系统的GUI

　　如果你认为Linux的GUI做得比Windows(98)的GUI好的话，如果你还想成为一名web designer的话，请纠正这种观点。

　　windows的GUI是专业的。Linux的xwindow只是起步阶段。也许有一天，Linux的GUI会发展得更胜一筹，但就目前的产品而言，请不要过多追随。

　　具体windows的GUI好在哪里，不是这一页可以罗列的。我会专门发表相关论述。

对于后台程序

　　最有助于web开发的后台程序是最新的.net平台中的asp.net

　　请不要讲jsp拿来做比较。我不给出理由。

　　asp.net实现了后台程序和html表现的完全剥离。程序员可以用程序方便地控制一个page上的所有元素。

　　php和asp总体开发效率差别不大。可以根据操作系统选用适当的平台。

对于初学者

　　问：用DreamWeaver还是FrontPage?

　　答：如果你最终停留在普通水平，那么这两样东西没什么大区别。如果你会成为一名高手，那么你兴许会愿意选择其中一种来帮你生成你没背出的html语法。

　　问：PhotoShop or FireWorks?

　　答：前者。

　　问：IE or NS?

　　答：前者。（除非你的站点专门针对Linux系统的用户，那么你可以选择NS开发）

　　问：你能不能教我xxxx?

　　答：自学。

对于管理者

　　你可以选择花2k的月薪雇用6-7名普通的web designer每天更新网站的内容，你也可以选择花8k雇用1-2名资深设计师做统筹设计。这取决于你的web项目。

　　只是有一点必须要提醒：web designer不等于平面设计师。任何用平面设计师的qualification去招募web designer的招聘广告都是低水准的，不会有最合适的人选前来应征。

对于导航

　　导航理论可以单独出一本书。但是我更愿意用简洁的方式表明导航的要点：

　　单独页面上明确地让浏览者知道本页在整个站点中的位置；前后一致的主菜单和清晰的次级菜单；尽量避免弹出式页面；避免使用frame；

　　很简单的导航原理，看上去没有什么伟大的创新之出——这正是导航的精髓。

对于协同开发

　　Web Design的协同工作相当困难。要将优秀的设计师组成团队合作开发比将优秀的程序员组合在一起更困难。

　　不要把两名心存不同抱负的优秀designer的工作职责分配在一起。

　　一个Team只能有一名做总设计的designer，可以将banner,button等相对独立的工作交给分管的designer。绝对不要把css文件交给两个不同的designer。

　　在做一个需要多名designer合作开发的大项目时，找一名能言善道的leader是十分有帮助的。

对于个人主页

　　个人主页的建设无疑是重要的。它的难度不亚于商业项目。

　　技术上有实力的设计者并不一定能做出出类拔萃的个人主页来。

　　好比养鱼，养一大群鱼，既容易又能获得商业利润；养几条小鱼，既难养又需要付出。

　　但养育者的底蕴与内涵也由此而体现。

　　做项目时自己写一段js给大家。关于文本限制字数的问题，在实际开发中经常用到;主要问题出现在对中文的限制，下面代码就解决关于限制字节数的校验问题;只要将此下代码保存到一个js文件中并引入到校验的页面中，便可使用!同时希望大家给与大力支持和宝贵意见，本人会在今后闲余之际，发表更多的好文章，谢谢!!

很多朋友对我说，她/他有代码洁癖，即，让她/他写XHTML的话，从来不愿意加上额外的标签（tag）。举个简单的例子，相信很多人从很多地方都看到过的：

<div id="nav">
<ul>
  <li></li>
  <li></li>
  ......
</ul>
</div>

很多人，包括许多业界大牛，都建议你这样写即可：

<ul id="nav">
<li></li>
<li></li>
......
</ul>

　　当然，我个人很欣赏第二种写法，没错，简洁明了，语义（semantic）确凿。但请等一等，如果需要样式化（stylish）它，哪一种可以提供更多的控制（controll）? 很明显，第一种。

　　然后，这个问题就有点让人抓狂了。一句话：你是结构（markup）优先呢，还是表现（presentation）优先？我相信，在如今这个不美好的时代，表现优先是第一准则。很多有理想的人，包括我，最后为了实现表现上的需要，标签汤（tag soup）实际上难以避免。

　　所以，这只能是个度的问题。别滥用。怎么不算滥用，也没有什么准则。我个人的准则是：如果要实现一个表现上的需要，你使用超过三层的外围标签（wrappers?），就应该停下来仔细想想了。尽管有点老，但我还是建议你看一看SimpleQuiz上面一些有趣的讨论。

　　为什么会这样？因为一切都不完美。试想一下，如果CSS能够提供更多的规则来控制页面上的元素，或许就不会这么尴尬。比方说，background-image支持trlb（上右下左）四个方向不同的图片的话，我们就不必为处理圆角而绞尽脑汁；支持从页面上产生元素，如content的话，那么也可以大大减少tag的使用……

　　XHTML？笑话。实际上目前为止没有多少人在用XHTML，一切都是自欺欺人。XHTML is Dead! XHTML是xml，具有xml的一切优越性，但是，我们现在看到的，都是text。如果把text当作xml来处理，这是有害的（Sending XHTML as text/html Considered Harmful）。

　　尽管我们在Doctype上都标明了我们用的是XHTML，但是实际上我们都在用HTML。这是现实。要不那些错误百出的非良构的页面怎么可能在宽容的当代浏览器中显示呢……也难怪，XHTML 1只是HTML 4的改良而已。但是，未来的XHTML 2并不向后兼容，我不知道我们使用XHTML 1的必要性何在。另外，别拿accessibility来反驳我，分离结构与表现的HTML 4并没有跟XHTML 1有任何区别。

　　因此，可能，使用XHTML 1的意义在于，宣称我们已经有了这样的思想，并且为未来的XHTML 2做好了准备。

　　这也是我为什么，强烈建议使用HTML 4.01 Strict Doctype的原因。从公司/企业来说，要求整个团队都具有web standards的思想，并贯彻相关原则并非易事，各种上个世纪遗留的思想仍然负隅顽抗。如果真的使用XHTML 1，很多只能兼容html的JavaScript脚本会失效，编辑某个不经意的未转义的字符会导致整个页面出错（xml parsing error），等等。为了避免问题，或许，HTML 4.01 Strict Doctype是现在的最佳选择。

1、有疑问，先验证

调试时，先对代码进行验证。格式不正确的XHTML/CSS会导致许多错误。

先在你最常用的浏览器中撰写和测试CSS代码，并尽量完善代码。然后再设法兼容其它浏览器。这样从一开始你的代码就是符合标准的，不必再为支持其它浏览器而劳心费神。（遵从标准的浏览器是Mozilla/Firefox, Safari, Opera）

2、确保你期望的效果确实存在

许多特定浏览器的专有CSS扩展在正式标准中并不存在。例如filter，滚动条样式，除了IE之外，在其它浏览器中毫无作用。如果验证器告诉你代码没有定义，极大的可能就是您用了私有样式，这样在不同的浏览器中很难达到一致的效果。

3、如果有浮动，就要适时使用clear

如果发现浮动对象出现了问题，考虑一下clear吧！

4、边距的合并

如果使用了margin，边距的合并讲话出现问题。避免将padding/border和固定宽度同时应用到同一元素。当子元素固定时，为父元素指定padding。

5、避免IE下未指定样式内容的闪烁。

如果仅使用@import来输入外部样式表，早晚会发现IE有闪烁的毛病。应用css之前，未经格式化的HTML文本会短暂的出现。

6、可怜的min-width

IE不支持它，但是它将 width 当作 min-width。

7、如果使用了锚点，在应用超链接样式时要特别小心。

如果您在代码中使用了传统的锚点(<a name="anchor">)，您会注意到 :hover 和 :active伪类也会作用于它。要避免这种情形，你可以使用 id

8、“LoVe/HAte”（爱/恨）链接规则

要以下面的顺序指定超链接伪类：Link, Visited, Hover, Acitve。任何其他顺序都不妥当。假如用了 :focus，次序应为 LVHFA

9、请记住“顺时针”边框。

边框(border)、边距(margin)和补白(padding)的简写次序为：顺时针方向从上开始，即 Top, Right, Bottom, Left。比如 margin: 0 1px 3px 5px;表示上边距为零，右边距为1px，依此类推。

10、非零值要指明单位。

在用CSS指定字体、边距或大小时，必须指明所用的单位。某些浏览器对未指明单位的处理方法不足为凭。零就是零，不管是 px还是em还是其他单位，它不需要单位。例如： padding: 0 2px 0 1em;

11、测试不同的字体大小。

像Mozilla和Opera这样的高级浏览器允许对字体进行缩放，不管你用的是什么单位。某些用户的默认字体大小肯定和您的不同，尽最大努力去满足他们。
用嵌入式测试，发布时改为输入。

12、将样式表嵌入在你的HTML源代码中，在测试时可以消除许多缓存引起的错误，尤其是某些Mac下的浏览器。但在发布前，一定要记住将样式表移到外部文件，用 @import 或 <link>引入。

13、加上明显的边框有利于布局调试。
像 div {border: solid 1px #f00;} 之类的全局规则可以暂时为你查出布局问题。为特定的元素加上边框可帮您找到难以发觉的交错或空白问题。

14、好好组织您的CSS文件

恰当地成块注释CSS，将相似的CSS选择符编为一组，养成一致的命名习惯和空白格式（为跨平台考虑，建议用空白字符而不是tab）以及适当的次序。

15、以功能（而不是外观）为类和ID命名

假如您创建了一个 .smallblue 类，后来打算将文字改大，颜色变为红色，这个类名就不再有任何意义了。相反，您可以用更有描述性的名字如 .copyright 和 .pullquote。

16、组合选择符

保持CSS短小对减少下载时间非常重要。请尽量为选择符分组、 利用继承(inheritance)以及使用简写(shorthand)来减少冗余。

17、使用图片替换技术时要考虑亲和力（SFIR，不常用，用图片替换文字的技术）
已经发现传统的FIR在屏幕阅读器，以及关闭图片显示[的浏览器]中会出问题。 对此有其他解决办法，要根据具体情况，慎重使用。

MySQL的ODBC接口实现是通过安装MyODBC驱动，这个驱动程序是跨平台的。如果在Linux等unix体系操作系统下使用，需要先安装Iodbc这些第三方ODBC标准支援平台。

简单的ASP示例代码：

<% dim sql,mysql set sql = server.createobject("adodb.connection") mysql="driver={mysql odbc 3.51 driver};database=库;server=主机;uid=用户;password =密码;" ’option = 设置 sql.open mysql %>

上边这段代码是采用MyODBC开发版3.51连接的示例，使用开发版是因为一些新的特性和稳定性2.x正式版所不具备的。前几天看了篇微软安全专家所撰写的如何编写安全程序的教程。上边提到如果按照上边示例的方法一旦ASP文件的代码被骇客看到，那么数据库可能不保，然后引发一连串的问题，甚至被夺得管理权限。文章中顺便提到了解决方法，是通过编写com组件，然后由ASP调用组件的方法连接数据库。这么做的好处是提高了安全性，但是问题是有能力这么做的人毕竟是少数。那么我的折衷方案是定义数据源。将库、用户、密码以及设置这些连接信息统统在数据源中定义，从很大程度简单化了实现的难度，而且也起到增强安全性的作用。当然，为了保证数据源可以在实际运作环境中被访问到，一定要定义为“系统数据源”，开发时定义为“用户数据源”或者“系统数据源”我倒觉得无伤大雅。

<% dim sql set sql = server.createobject("adodb.connection") sql.open "dns=MySQL数据源名称" %>

本文概述：

1、在MySQL中建立一个新的数据库。

2、一个怎样储存文件的例子程序。

3、一个怎样访问文件的例子程序。

在MySQL中建立一个新的database。

首先，你必须在你的MySQL中建立一个新的数据库，我们将会把那些二进制文件储存在这个数据库里。在例子中我会使用下列结构，为了建立数据库，你必须做下列步骤：

进入MySQL控制器；

输入命令“create database binary_data;”

输入命令“use binary_data;”

输入命令：

CREATE TABLE binary_data ( id INT(4) NOT NULL AUTO_INCREMENT PRIMARY KEY, description CHAR(50), bin_data LONGBLOB, filename CHAR(50), filesize CHAR(50), filetype CHAR(50));" （注：不能断行）

如果没有意外，数据库和表应该建立好了。

一个怎样储存文件的例子程序 用这个例子你可以通过Html表单将文件传输到数据库中。

Store.php3 以下为引用的内容：

<?php // store.php3 - by Florian Dittmer <dittmer@gmx.net> ?> <HTML> <HEAD><TITLE>Store binary data into SQL Database</TITLE></HEAD> <BODY> <?php // 如果提交了表单，代码将被执行: if ($submit) { // 连接到数据库 // (你可能需要调整主机名，用户名和密码) MYSQL_CONNECT( "localhost", "root", "password"); mysql_select_db( "binary_data"); $data = addslashes(fread(fopen($form_data,  "r"), filesize($form_data))); $result=MYSQL_QUERY( "INSERT INTO binary_data(description,bin_data,filename,filesize,filetype) ". "VALUES (’$form_description’,’$data’,’$form_data_name’,’$form_data_size’,’$form_data_type’)"); $id= mysql_insert_id(); print  "<p>This file has the following Database ID: <b>$id</b>"; MYSQL_CLOSE(); } else { // 否则显示储存新数据的表单 ?> <form method="post" action=" <?php echo $PHP_SELF; ?>" enctype="multipart/form-data"> File Description:<br> <input type="text" name="form_description"  size="40"> <INPUT TYPE="hidden" name="MAX_FILE_SIZE" value="1000000"> <br>File to upload/store in database:<br> <input type="file" name="form_data"  size="40"> <p><input type="submit" name="submit" value="submit"> </form> <?php } ?> </BODY> </HTML>

如果你执行了这个程序，你将会看见一个简单的Html表单，单击“浏览”选择一个文件，然后单击提交。

当文件上传至web服务器之后，程序将会告诉你刚刚上传的文件的ID，记住这个ID，一会儿可能会用到。

一个怎样访问文件的例子程序

<?php // getdata.php3 - by Florian Dittmer <dittmer@gmx.net> // 调用方法: getdata.php3?id=<id> if($id) { // 你可能需要调整主机名，用户名和密码: @MYSQL_CONNECT( "localhost", "root", "password"); @mysql_select_db( "binary_data"); $query =  "select bin_data,filetype from binary_data where id=$id"; $result = @MYSQL_QUERY($query); $data = @MYSQL_RESULT($result,0, "bin_data"); $type = @MYSQL_RESULT($result,0, "filetype"); Header(  "Content-type: $type"); echo $data; }; ?>

程序必须知道要访问那个文件， 你必须将ID作为一个参数。

例如: 一个文件在数据库中的ID为2

你可以这样调用它: getdata.php3?id=2

如果你将图片储存在数据库里, 你可以向调用图片一样调用它。

例如: 一个图片文件在数据库中的ID为3. 你可以这样调用它:

怎样储存大于1MB的文件:

如果你想储存大于1MB的文件，你必须对你的程序、PHP设置、SQL设置进行许多修改，下面几条也许可以帮助你储存小于24MB的文件：

修改:store.php3 ，将 MAX_FILE_SIZE 的值改成 24000000。

修改:你的PHP设置，在一般情况下，PHP只允许小于2MB的文件，你必须将max_filesize（在php.ini中）的值改成24000000。 去掉MYSQL的数据包大小限制,在一般情况下 MYSQL小于1MB的数据包。

日志转移是这样一种处理过程，它能将某一数据库中的事务日志文件依次转存到备份的数据库中，进而为这一数据库创建一个“近乎”热备份。SQL Server 2000的数据库引擎中设置了日志转移功能，并在其中进行处理。所以它会自动完成复原到备份服务器的进程，而不需要数据库管理员手动操作。只有你的产品服务器操作失败，你才需手动完成到备份服务器的复原进程。(注释：尽管SQL Server 7.0和2005中均有日志转移功能，但本文主要针对SQL Server 2000。)

为何要使用日志转移?

日志转移是一种解决高可用性的措施，并且十分有效。同样作为高可用性的措施方案，日志转移相对集群来说，最大的好处是它要便宜许多。这是因为，使用集群功能有硬件要求，而日志转移则不需要。

日志转移在数据库与数据库而非服务器与服务器之间进行；因此才有可能将备份数据库存储在你已用作其他用途的服务器上。但如果转移失败则有可能会出现问题，这时你可换用备份数据库，这种选择是可用的。

日志转移相对比较容易安装。SQL Server提供了非常完善的向导帮助你安装这个进程。

日志转移允许你保存分布在不同地理位置中的冗余数据，SQL Server的集群功能则很难做到这一点。这一特点十分出众，因为，当你的数据中心遭到灾难时，你仍能在备份服务器中将其恢复过来。而在相同的数据中心，如果你使用的是集群功能，你就会陷入麻烦。

日志转移的另一优点是你能将备份数据库作为报告数据库使用，这对许多公司来说是很不错的选择。但如果你决定了用这个备份数据库作报告使用，就必须注意它的局限性。使用原始数据库中的日志时，SQL Server 要求指定唯一的通道，所以，当日志文件正在被应用时，报告则不能同时进行。

使用日志转移要考虑的相关因素

在将日志转移作为高可用性的方案来使用时，我们必须考虑以下几点因素。由于从原始数据库到备份数据库有一个潜伏期，对你的公司而言，它并非一定是可行的实现高可用性的一种解决方案。潜伏期由数据库管理员设置，时间也因需要而缩短, 但永远不能避免。

日志转移中没有设置恢复功能，这就意味着在将日志转移到备份服务器上时，这些日志都暂时不可用。因此，数据库管理员必须在将备份数据库放到网上前完成一系列的操作，这些步骤包括:

将已存储在备份数据服务器上原始数据库里的备份标签存储起来。一旦所有的标签被存储后，数据库就必须得到恢复，然后放到网上。
一旦所有的数据库都已放在网上，所有需要访问数据库的应用程序就需要改变自身的链接。如果你不能将应用程序尽快指向刚刚恢复的数据库，你就前功尽弃了。
一个SQL Server的实例能用于监控日志转移。这个实例可以在原始数据库、备份数据库或单独的数据库中。任何一种版本的SQL Server都能用于SQL Server监控。

注释:数据库登录必须在原始数据库与备份数据库之间同时进行.

视图的好处，它可以横纵分割表，在视图上的可以执行与在表上一至的操作，如：Insert、Update、Delete。这些操作与在表上的相应操作大至相同，不过也有些不同之处。在视图上进行操作的列是只属于视图的列，这些列不一定包含对应表中的所有列，所以在执行Insert操作或Update操作时，如果视图中有未被包含的列，并且这些列是Not NULL的，那么在视图上执行相应的Insert操作或Update操作时就会失败，还有在视图上如果使用了Group By、Distinct等操作时，不能执行Insert或Update操作。还有一点需要注意的是，如果视图中包含的不只是一个表，那么执行Insert或Update一次只能对视图中的某个表进行操作，也就是说，如果视图中包含了两个表A、B，那么就需要对视图执行两次Insert或Update操作，一次操作表A的各个列，一次操作表B的各个列。

语法：

Create View View_Name [columnname,……]AS Select Statement [WITH CHECK OPTION] [WITH ENCRYPTION]

举例说明：

Use SomeDataBase Go –这句与MySQL的一样，就是表示要进入某个数据库Create View SomeView –创建一个视图SomeViewAsSelect * from UserInfo [WITH ENCRYPTION] –在Select 语句后加上With Encryption 表示对视图进行加密，这样其它用户查看这个视图时，就看不到视图中的内容。GO

事务：

在MS SQL Server中对事务的操作一共有四个，它们是：

Begin Transaction、Commit、Rollback和Save Transaction。

索引：

索引有四种，唯一索引、簇索引、非簇索引和复合索引。

表扫描一般用在大表返回绝大多数数据或小表查询某些数据时使用。在大表中查询有限量数据，一般使用索引。

索引其实是一种与表中的列相绑定的对象。

使用索引的时机：

1.经常被查询搜索的列。

2.在Order by子句中使用的列。

3.是外键或主键的列。

4.该列的值唯一的列。

不能使用或不适合使用索引的情况：

1.在查询中很少被引用的列。

2.数据类型为bit、text和Image等的列不能建立索引。

语法：

Create [UNIQUE][CLUSTERED|NONCLUSTERED] Index index_name On TableName (Column [,…n])

举例说明：

Create UNIQUE CLUSTERED Index SomeIndex On UserInfo (UserName)

这就是在表UserInfo的列UserName上建立的一个唯一簇集索引。

本文通过使用十二个步骤来仔细讲解Linux下如何优化你的Oracle。

1. 标准优化：遵从Oracle技术文档中的说明tune你的Linux，比如共享内存等等。这里不赘述了，因为文档中很全。

2. 根据你的使用情况采取Dedicate型或MTS型数据库。详细方法也看文档。

3. 如果你不是对数据库中的Java应用特别有需求的话，不要装它，也不要启动它。（如果你装了的话）

4. 对你的服务器来说，最好专用。如果你不专用，说明你对性能并不那么敏感，也用不着优化了。

5. 内存越大越好。但Linux对内存大小有限制，因此需要去找一些Patch。

6. 下载一个SGI's POSIX Asynchronous I/O and Raw I/O的内核Patch。它能大幅度提高你数据文件的访问速度。

7. 如果你采用ext2文件系统，把Block的大小增加到4~8KB。其中dbf所在分区的大小最少弄到8192KB。

8. 尽可能用SCSI硬盘。如果是IDE的，好好调调参数。

9. 这里是一个示例程序:

set -a VM=/proc/sys/vm BDFLUSH="40 1024 64 256 500 3000 500 1884 2" BUFFERMEM="5 8 10" FREEPAGES="512 1024 3072" OVERCOMMIT="1" case $1 in start) echo "$BDFLUSH">$VM/bdflush echo "$BUFFERMEM">$VM/buffermem echo "$FREEPAGES">$VM/freepages echo "$OVERCOMMIT">$VM/overcommit_memory /sbin/hdparm -k -u 1 -m 32 -c 1 /dev/hda; /sbin/hdparm -k -u 1 -m 16 -c 1 /dev/hdc; ;; stop) touch /root/shouldnt.happen; ;; *) echo "USAGE $0 {start|stop}"; ;; esac;

10. 如果你有Solaris for X86的话，可以运用它的分区工具把你的所有分区都改成UFS。Linux的当前Kernel是支持UFS的。在数据库运用上，UFS比ext2好。

11. 如果可能，应该采用诸如IBM JFS或SGI XFS这样的64位文件系统。

12. 不要用Linux发行版带的核心，要自己编译。