<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>肉包子的摇滚生活 &#187; SEO</title>
	<atom:link href="http://www.fangyuqiang.com/archives/tag/seo/feed" rel="self" type="application/rss+xml" />
	<link>http://www.fangyuqiang.com</link>
	<description>前端开发，交互设计，用户体验</description>
	<lastBuildDate>Wed, 01 Sep 2010 09:06:13 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0.1</generator>
		<item>
		<title>危险的SEO手段</title>
		<link>http://www.fangyuqiang.com/archives/700</link>
		<comments>http://www.fangyuqiang.com/archives/700#comments</comments>
		<pubDate>Wed, 09 Dec 2009 01:08:49 +0000</pubDate>
		<dc:creator>fangyuqiang</dc:creator>
				<category><![CDATA[技术周边]]></category>
		<category><![CDATA[SEO]]></category>

		<guid isPermaLink="false">http://www.fangyuqiang.com/?p=700</guid>
		<description><![CDATA[可能做SEO的，有见到过这样的广告：
如果您的关键词在搜索结果自然排名前20名，即可利用本系统优化，3天内即可将排名提升至第一，对绝大多数关键词有效！
这种手段其实是非常危险的。]]></description>
			<content:encoded><![CDATA[<p>可能做SEO的，有见到过这样的广告：</p>
<blockquote><p>如果您的关键词在搜索结果自然排名前20名，即可利用本系统优化，3天内即可将排名提升至第一，对绝大多数关键词有效！</p>
<p>【优化原理】搜索引擎根据排在前20名的网站的点击次数（“客户体验”机制）确定前20名的网站的最终排序，哪些网站点击次数多，说明与关键词相关性越强，排序就会靠前，我们的系统模拟人工点击要优化的网站，迅速（24小时内）提升网站在搜索引擎中的自然排名，形成冲刺效果。<br />
系统根据关键词热度及网站排名等因素使用不同的点击速度，同时根据优化效果进行智能调节，确保安全、稳定!</p>
<p>在线提交关键词立即开始优化，<br />
1-3天即可见效！<br />
生效后免费试用10天再付款，安全可信！</p></blockquote>
<p>说白了，这是个黑帽SEO，它本质上并不是改进了网站自身的质量来改进的，而是利用了搜索引擎的机制或者说是固有缺陷来实现的。<strong>这样的做法风险是非常大的</strong>。因为从技术角度来说，搜索引擎要想发现这样的作弊并不困难。如果搜索引擎发现了这一漏洞被黑帽SEO滥用，那么很有可能对作弊的网站进行严厉的惩罚，google降权，百度k站等。不过再来看看<a href="http://baiduup.com/faq.asp" target="_blank">它的问答</a>如何解释这个问题：</p>
<blockquote><p>问：使用了你们的服务，我的网站会被百度惩罚（被K）吗？</p>
<p>回答：首先，我们的系统完全模拟百度算法，软件开发中设计的独有的网站保护机制随时监视百度数据服务器的状态，一旦有问题会自动启动网站躲避模块，有效的保证了会员网站的隐蔽性和安全性，极少会发生被K站的这类情况，所以您没必要有这方面的担心。</p>
<p>其次，我们经过一年多上千家网站的实践，我们的优化是非常安全、稳定的，绝不会因使用本站服务而导致网站被百度惩罚，如果百度会因此惩罚网站，那么我们岂不是想让谁的网站被惩罚（被K），谁的网站就会被惩罚吗？我们可以反过来利用这一漏洞，将你的竞争对手的网站都让百度K掉，仍然可以将你的网站优化到第一，到时候百度不是大乱？</p></blockquote>
<p>如此策略确实看似完美，但是首先，模拟百度算法，还有什么网站保护机制，90%都是屁话。监视百度数据服务器状态，这句完完全全是屁话，数据状态都属于搜索引擎核心的机密，你通过什么来监视？</p>
<p>不过说实话，第二条理由我还真没有想到搜索引擎该如何应对，但是我想不到不代表别人想不到。不是吗？</p>
<p>不管如何，坚持正确的SEO策略，改进网站本身的质量才是网站的长久之道。作弊的手段总归不会长久。</p>
]]></content:encoded>
			<wfw:commentRss>http://www.fangyuqiang.com/archives/700/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>一些冷门但是关键时刻很有用的html标签与属性</title>
		<link>http://www.fangyuqiang.com/archives/548</link>
		<comments>http://www.fangyuqiang.com/archives/548#comments</comments>
		<pubDate>Wed, 16 Sep 2009 03:49:38 +0000</pubDate>
		<dc:creator>fangyuqiang</dc:creator>
				<category><![CDATA[Html+CSS]]></category>
		<category><![CDATA[SEO]]></category>
		<category><![CDATA[web标准]]></category>
		<category><![CDATA[浏览器兼容性]]></category>

		<guid isPermaLink="false">http://www.fangyuqiang.com/?p=548</guid>
		<description><![CDATA[html的标签个数不多，大概90多个，去掉一些非标准的以及不推荐的标签，例如b,i之类的，大概剩50，60个。通常做开发的时候，用在界面上的，都是p,div,span,table,h1-h4，加上表单元素的form,input,select,textarea。除了这些之外，有些比较少用的标签往往都被忽略了，关键时候，这些标签跟属性比你绞尽脑汁去想办法解决好得多。这里一些有用的标签跟属性列举一番。以下按字母顺序介绍,后面都附带w3school提供的测试使用地址。 1.a 链接标记，这个常用得不行，地球人都知道。这里要说的是href属性。说到href，地球人都笑了，a里面几乎都有href属性不是?这里要说的是一个特殊的属性值，href=&#8221;mailto:fangyuqiang@gmail.com&#8221;，比较了解html又笑了，这个就是可以打开电脑上默认的邮件发送工具给fangyuqiang@gmail.com发送邮件，老式的网站很经常出现在联系我们的那个按钮上面的嘛。实际，更深一层的，href属性里面甚至是可以指定要发送的邮件的标题跟正文内容，甚至抄送的人都可以指定，这个知道的人就不多了吧？ 具体的使用方法： 可以使用形如&#8221;mailto: ddsd@gmail.com?cc=test@test.com&#38;bcc=test1@test1.com&#38;subject=一些冷门但是关键时刻很有用的html标签与属性&#38;body=这篇文章可以看看哦&#8220;这样的语句，在这个语句中第一个功能以&#8221;?&#8221;开头，后面的每一个功能以&#8221;&#38;&#8221;开头。当用鼠标单击这个邮件地址时，在随后打开的邮件编辑窗口中，我们将看到在收件人地址栏中自动填写上了ddsd@gmail.com，在抄送地址栏中自动填上了test@test.com，在暗送地址栏中自动填写上了test1@test1.com，在主题栏中自动填写上了&#8221;&#8216;一些冷门但是关键时刻很有用的html标签与属性&#8221;，在信件的正文部分将自动出现&#8221;这篇文章可以看看哦&#8221;这样的文字。注意，多个邮件地址可以用分号;隔开，这样就可以同时发送给多个地址。 这个有啥用呢？在有些情况下，假设你做了一个按钮，希望用户点击按钮后会给你发送邮件提建议，你就可以这么做，把标题内容体都先写好，这样用户体验会好得多。 http://www.w3school.com.cn/tiy/t.asp?f=html_mailto2 另外，mailto这样的地址也是可以出现在form的action里面的。也许更方便： http://www.w3school.com.cn/tiy/t.asp?f=html_form_mail 此外，&#60;a&#62;的rel跟rev属性，虽然现在没有浏览器支持，我觉得也是值得注意的。尤其是rel，为啥呢？虽然浏览器不支持，但是SEO却有用到。有多个主流搜索引擎可以识别这个属性。目前可以用rel=&#8221;canonical&#8221;来表明内容相同的网页，可以避免被搜索引擎认为是重复内容而导致被屏蔽或者删除索引。 2.abbr与acronym 这2个标记都少用，简单的说，都是定义与显示缩写的。abbr标签貌似IE6不支持。使用这2个标签主要是为了语义化与SEO。哦，对了，还可以炫耀你懂的标签比较多，比如说我的博客最下面的valid XHTML，鼠标移动上去就会显示完整含义。 http://www.w3school.com.cn/tiy/t.asp?f=html_abbracronym 3.area 这是几年前很流行的技术，图像热点链接，点击图像上面不同的部分进入不同的链接，现在使用得比较少了，也没什么人关注了。这里重提下，是因为现在这个标签在webgame的地图上被大量运用，如果你对webgame有兴趣，或许你应该对这个标签的有深入的调研与了解。推荐使用Dreamweaver来学习使用这个标记。 http://www.w3school.com.cn/tiy/t.asp?f=html_areamap 4.base 使用myeclipse的童鞋对这个标签应该比较熟悉，因为myeclipse自动生成的html代码会带有这个标签。它可以为页面上的所有链接规定默认地址或默认目标。指定base元素后，页面会根据使用指定的基本 URL 来解析所有的相对 URL。这其中包括 &#60;a&#62;、&#60;img&#62;、&#60;link&#62;、&#60;form&#62; 标签中的 URL。有时候你需要书写大量的完整的url地址的页面上，并且这些url都是来自同一基准地址的话，就可以应用base标签来指定，后面的url就可以放心的全部采用简单的相对地址。 http://www.w3school.com.cn/tiy/t.asp?f=html_base_test 5.button 有些人搞不清楚button跟input type=“button”，input type=“submit”的区别，对于各自的使用场景不了解。此外，由于不同的场景下不同浏览器对于button的处理也有差异，这个标签看起来简单，却也容易搞糊涂。 &#60;button&#62; 控件 与 &#60;input type=&#8221;button&#8221;&#62; 相比，提供了更为强大的功能和更丰富的内容，可控制性比较强。但是特别要注意的是：使用button最好指定type属性，因为IE 的默认类型是 &#8220;button&#8221;，而其他浏览器中（包括 W3C 规范）的默认值是 &#8220;submit&#8221;，也就是说，IE下默认的button行为类似input type=&#8221;button&#8221;，而其他浏览器例如firefox，行为类似input type=&#8221;submit&#8221;。如果你在表单内部放了一个button标签，只是为了点击调用一个Javascript函数，IE下可能如你所愿，但是firefox下可能把你的表单都提交走了。此外，还有一点，提交表单的时候，IE 将提交 &#60;button&#62; 与 &#60;button/&#62; 之间的文本，而其他浏览器将提交 value 属性的内容。 http://www.w3school.com.cn/tiy/t.asp?f=html_button_test 6.caption 定义表格的标题，比较少用，只是为了语义化，以及可用性（针对屏幕阅读器）。 7.col与colgroup [...]]]></description>
			<content:encoded><![CDATA[<p>html的标签个数不多，大概90多个，去掉一些非标准的以及不推荐的标签，例如b,i之类的，大概剩50，60个。通常做开发的时候，用在界面上的，都是p,div,span,table,h1-h4，加上表单元素的form,input,select,textarea。除了这些之外，有些比较少用的标签往往都被忽略了，关键时候，这些标签跟属性比你绞尽脑汁去想办法解决好得多。这里一些有用的标签跟属性列举一番。以下按字母顺序介绍,后面都附带w3school提供的测试使用地址。<span id="more-548"></span></p>
<h3>1.a</h3>
<p>链接标记，这个常用得不行，地球人都知道。这里要说的是href属性。说到href，地球人都笑了，a里面几乎都有href属性不是?这里要说的是一个特殊的属性值，href=&#8221;mailto:fangyuqiang@gmail.com&#8221;，比较了解html又笑了，这个就是可以打开电脑上默认的邮件发送工具给fangyuqiang@gmail.com发送邮件，老式的网站很经常出现在联系我们的那个按钮上面的嘛。实际，更深一层的，href属性里面甚至是可以指定要发送的邮件的标题跟正文内容，甚至抄送的人都可以指定，这个知道的人就不多了吧？</p>
<p>具体的使用方法：<br />
可以使用形如&#8221;<strong>mailto: ddsd@gmail.com?cc=test@test.com&amp;bcc=test1@test1.com&amp;subject=一些冷门但是关键时刻很有用的html标签与属性&amp;body=这篇文章可以看看哦</strong>&#8220;这样的语句，在这个语句中第一个功能以&#8221;?&#8221;开头，后面的每一个功能以&#8221;&amp;&#8221;开头。当用鼠标单击这个邮件地址时，在随后打开的邮件编辑窗口中，我们将看到在收件人地址栏中自动填写上了ddsd@gmail.com，在抄送地址栏中自动填上了test@test.com，在暗送地址栏中自动填写上了test1@test1.com，在主题栏中自动填写上了&#8221;&#8216;一些冷门但是关键时刻很有用的html标签与属性&#8221;，在信件的正文部分将自动出现&#8221;这篇文章可以看看哦&#8221;这样的文字。注意，<strong>多个邮件地址可以用分号;隔开</strong>，这样就可以同时发送给多个地址。</p>
<p>这个有啥用呢？在有些情况下，假设你做了一个按钮，希望用户点击按钮后会给你发送邮件提建议，你就可以这么做，把标题内容体都先写好，这样用户体验会好得多。</p>
<p><a href="http://www.w3school.com.cn/tiy/t.asp?f=html_mailto2" target="_blank">http://www.w3school.com.cn/tiy/t.asp?f=html_mailto2</a></p>
<p>另外，<strong>mailto这样的地址也是可以出现在form的action里面的</strong>。也许更方便：</p>
<p><a href="http://www.w3school.com.cn/tiy/t.asp?f=html_form_mail" target="_blank">http://www.w3school.com.cn/tiy/t.asp?f=html_form_mail</a></p>
<p>此外，&lt;a&gt;的rel跟rev属性，虽然现在没有浏览器支持，我觉得也是值得注意的。尤其是rel，为啥呢？<strong>虽然浏览器不支持，但是SEO却有用到。有多个主流搜索引擎可以识别这个属性。</strong>目前可以用rel=&#8221;canonical&#8221;来表明内容相同的网页，可以避免被搜索引擎认为是重复内容而导致被屏蔽或者删除索引。</p>
<h3>2.abbr与acronym</h3>
<p>这2个标记都少用，简单的说，都是定义与显示缩写的。abbr标签貌似IE6不支持。<strong>使用这2个标签主要是为了语义化与SEO</strong>。哦，对了，还可以炫耀你懂的标签比较多，比如说我的博客最下面的valid XHTML，鼠标移动上去就会显示完整含义。</p>
<p><a href="http://www.w3school.com.cn/tiy/t.asp?f=html_abbracronym" target="_blank">http://www.w3school.com.cn/tiy/t.asp?f=html_abbracronym</a></p>
<h3>3.area</h3>
<p>这是几年前很流行的技术，图像热点链接，点击图像上面不同的部分进入不同的链接，现在使用得比较少了，也没什么人关注了。这里重提下，是因为现在这个标签在webgame的地图上被大量运用，如果你对webgame有兴趣，或许你应该对这个标签的有深入的调研与了解。推荐使用Dreamweaver来学习使用这个标记。</p>
<p><a href="http://www.w3school.com.cn/tiy/t.asp?f=html_areamap" target="_blank">http://www.w3school.com.cn/tiy/t.asp?f=html_areamap</a></p>
<h3>4.base</h3>
<p>使用myeclipse的童鞋对这个标签应该比较熟悉，因为myeclipse自动生成的html代码会带有这个标签。它可以为页面上的所有链接规定默认地址或默认目标。指定base元素后，页面会根据使用指定的基本 URL 来解析所有的相对 URL。这其中包括 &lt;a&gt;、&lt;img&gt;、&lt;link&gt;、&lt;form&gt; 标签中的 URL。有时候你需要书写大量的完整的url地址的页面上，并且这些url都是来自同一基准地址的话，就可以应用base标签来指定，后面的url就可以放心的全部采用简单的相对地址。</p>
<p><a href="http://www.w3school.com.cn/tiy/t.asp?f=html_base_test" target="_blank">http://www.w3school.com.cn/tiy/t.asp?f=html_base_test</a></p>
<h3>5.button</h3>
<p>有些人搞不清楚button跟input type=“button”，input type=“submit”的区别，对于各自的使用场景不了解。此外，由于不同的场景下不同浏览器对于button的处理也有差异，这个标签看起来简单，却也容易搞糊涂。</p>
<p>&lt;button&gt; 控件 与 &lt;input type=&#8221;button&#8221;&gt; 相比，提供了更为强大的功能和更丰富的内容，可控制性比较强。但是特别要注意的是：<strong>使用button最好指定type属性，因为IE 的默认类型是 &#8220;button&#8221;，而其他浏览器中（包括 W3C 规范）的默认值是 &#8220;submit&#8221;，也就是说，IE下默认的button行为类似input type=&#8221;button&#8221;，而其他浏览器例如firefox，行为类似input type=&#8221;submit&#8221;</strong>。如果你在表单内部放了一个button标签，只是为了点击调用一个Javascript函数，IE下可能如你所愿，但是firefox下可能把你的表单都提交走了。此外，还有一点，<strong>提交表单的时候，IE 将提交 &lt;button&gt; 与 &lt;button/&gt; 之间的文本，而其他浏览器将提交 value 属性的内容</strong>。</p>
<p><a href="http://www.w3school.com.cn/tiy/t.asp?f=html_button_test" target="_blank">http://www.w3school.com.cn/tiy/t.asp?f=html_button_test</a></p>
<h3><strong>6.caption</strong></h3>
<p>定义表格的标题，比较少用，只是为了语义化，以及可用性（针对屏幕阅读器）。</p>
<h3>7.col与colgroup</h3>
<p>这2个属性其实本来应该是经常写table的人的福音一样的标签的。它可以为表格中一个或多个列定义属性值。比如说你表格中所有列都是左对齐，其中一列右对齐，不使用这个标签的话，那你就需要所有的td加上一个css的类来达到这个效果。但是用这个标签，只要一句&lt;col align=&#8221;center&#8221;&gt;就可以解决了。既然这么好，那为啥还说，本来应该是福音呢？悲剧的地方在于，<strong>这2个w3c标准标签与属性却只有IE能完整支持，firefox等目前都做不到（可以通过一些繁琐的高级的css来hack实现）。如果你的项目不考虑浏览器兼容，那你可以爽爽的用，或者针对firefox之类的浏览器写一个js脚本判断col，根据col动态添加对应的类到td上。</strong></p>
<p><a href="http://www.w3school.com.cn/tiy/t.asp?f=html_col_test" target="_blank">http://www.w3school.com.cn/tiy/t.asp?f=html_col_test</a></p>
<p><a href="http://www.w3school.com.cn/tiy/t.asp?f=html_colgroup_test" target="_blank">http://www.w3school.com.cn/tiy/t.asp?f=html_colgroup_test</a></p>
<h3><strong>8.dd,dl,dt</strong></h3>
<p>定义列表的3个标签。这3个标签应该说不属于冷门标签的范畴，但是本来使用范围也不广的才对。不过<strong>据说百度搜索非常偏爱这个标签，所以国内很多做SEO都大量用这个标签来做</strong>，看看dedecms的主题，几乎完全用这3个标签写的html。被滥用了。</p>
<h3>9.del与ins</h3>
<p>这2个标记用来显示被删除的文本以及插入的文本，一般浏览器会显示成删除线与下划线。<strong>一些blogger在更新博文的时候会经常使用这2个标记，符合语义化与SEO</strong>。如果不用这2个标记，使用css的text-decoration也能达到同样的效果。</p>
<p><a href="http://www.w3school.com.cn/tiy/t.asp?f=html_delins" target="_self">http://www.w3school.com.cn/tiy/t.asp?f=html_delins</a></p>
<h3>10.input</h3>
<p>input标签常见得不行，但是input的属性也非常多，有几个稍微特别的属性可以介绍下。</p>
<p>accept属性，类型为file的文件上传框，可以指定accept，然后通过Javascript之类的，在客户端做一下判断上传的类型是否符合格式。注意，<strong>就算你在input上面指定了accept，浏览器也不会去保证上传上去的格式是符合要求的，同样还需要在服务端做判断。</strong></p>
<p>disabled跟readonly属性，2个使用上区别不大。disabled范围更广一些，它可以禁止下拉框。在一些需要禁用文本框的时候，看情况选择使用这2个属性，readonly不能修改值，但是可以选中复制，可能更加友好。</p>
<p>size属性，相信吃过这个苦头的人也有不少吧。<strong>相同的size，在IE下，text跟password类型的input显示的宽度是不一样的</strong>，而其他浏览器却会显示一样的宽度。所以还是<strong>用css来定义input的宽度</strong>吧。</p>
<p>maxlength属性，这个是很好用的属性。这个限制长度的属性是基于浏览器原生的实现，不需要再用Javascript去控制避免用户输入过长的数据,这可是标准属性。</p>
<p><a href="http://www.w3school.com.cn/tags/tag_input.asp" target="_blank">http://www.w3school.com.cn/tags/tag_input.asp</a></p>
<h3><strong>11.link的media属性</strong></h3>
<p>这个就是很常见的引入css的标记（虽然它本意不仅仅是用来引入css的，但是目前浏览器只支持引入css）。这里要提的是media属性。media指定了当前的css针对的设备，如果识别到对应的设备来访问，就调用对应的css link。最常用的其实就2种，一种，就是不写，默认是screen，计算机屏幕。一种就是print，打印用。经常可以在网页上面看到一个打印的链接，可以直接把网页打印出来。最早时候我在新浪看到它的打印的实现，是专门设计一个页面，点击打印就进到一个打印专用的页面，然后用浏览器的打印。其实完全不需要，<strong>只要在所需要提供打印的页面，加入一个专门的media=“print”的css link，为打印的界面设计专门设计一套css，不需要再去打开新页面。</strong></p>
<p><strong>通常建议使用link而不是@import来引入css</strong>。根据yahoo提出的前端性能优化法则，css应该放在顶部，尽快被浏览器加载。但是因为IE6在处理采用@import的css的时候，会当成外部引用而放到最后去加载，对前端性能有所影响。</p>
<p><a href="http://www.w3school.com.cn/tiy/t.asp?f=html_link" target="_blank">http://www.w3school.com.cn/tiy/t.asp?f=html_link</a></p>
<h3>12.noframes与noscript</h3>
<p>2个为了可用性实现的标记。在不支持框架与Javascript显示特别的文字。如果框架或者Javascript对于你的应用至关重要，那么你应该使用这样的标记来做一个警告提示，提示用户开启脚本。</p>
<p><a href="http://www.w3school.com.cn/tiy/t.asp?f=html_noframes" target="_blank">http://www.w3school.com.cn/tiy/t.asp?f=html_noframes</a></p>
<p><a href="http://www.w3school.com.cn/tiy/t.asp?f=html_noscript" target="_blank">http://www.w3school.com.cn/tiy/t.asp?f=html_noscript</a></p>
<h3>13.object</h3>
<p>object定义一个嵌入的对象，可以使用此元素向 XHTML 页面添加多媒体。关于object标签的具体使用我也没有具体了解过。常常只在一些提供给外部调用的时候用到，常见的地方在视频网站提供给你的插入页码的代码。IE6下是使用embed来实现插入多媒体的，但是embed是非标准属性。呃。。很早之前，为了能完美通过html validate，狠折腾了一番embed跟object共存的方法。</p>
<h3>14.ol的type属性</h3>
<p>通常页面上使用ul比ol要多，用过ol的大概印象就是知道列表不是小圆点，而会显示数字顺序。但是用type属性，可以指定ol数字顺序的形式，例如罗马数字I,II，或者是字母顺序A，B，C，或者是小写字母。不过type属性是非标准属性。</p>
<p><a href="http://www.w3school.com.cn/tiy/t.asp?f=html_lists_ordered" target="_blank">http://www.w3school.com.cn/tiy/t.asp?f=html_lists_ordered</a></p>
<h3>15.optgroup</h3>
<p>我觉得这个标签是挺好用的一个标记，但是注意到的不多。optgroup用于组合选项。使用一个长的选项列表时，对相关的选项进行组合。例如出现一个人员的下拉列表的时候，人员按部门用optgroup分组，看起来分割得很清楚。此外，还可以用Javascript来做增强显示。比如你用js写一个弹出层，点击的时候解析select标签，列出所有部门跟人员分组供选择。如果客户禁用js，那么可以平稳退化成一个分组下拉菜单。</p>
<p><a href="http://www.w3school.com.cn/tiy/t.asp?f=html_optgroup">http://www.w3school.com.cn/tiy/t.asp?f=html_optgroup</a></p>
<h3>16.script的defer属性</h3>
<p>defer 属性规定是否对脚本执行进行延迟，直到页面加载为止。如果脚本不会改变文档的内容的话，设置这个属性可以加快文档处理速度。因为它会到文档完全显示完再解析Javascript。目前只有IE支持这个属性。不过，通常最慢的不就是IE吗。。</p>
<h3>17.select的multiple与size</h3>
<p>这2个属性其实是常用属性。只是顺便提一下。这2个属性结合使用可以控制下拉多选菜单。设置了multiple属性之后，可以用ctrl来复选多个选项。size用来控制同时显示的菜单项的个数。</p>
<h3>18.sub与sup</h3>
<p>这2个标签可以用来显示上下标，通常用在一些计算公式上面。不过还可以经常在页面上显示一些标注标记，比如说加一个[1]表示注解1这样的。此外，经常logo附近带有alpha,beta之类的版本号，可以用上标来实现，简单，粗暴。</p>
<p><a href="http://www.w3school.com.cn/tiy/t.asp?f=html_sup" target="_blank">http://www.w3school.com.cn/tiy/t.asp?f=html_sup</a></p>
<h3>19.table的cellspacing属性</h3>
<p>table标签上经常可以看到cellspacing属性与cellpadding属性，还有border。虽然这些是控制外观的属性，但是它们是名正言顺的标准属性，可以放心用。一般都建议采用css来控制表格样式。但是有个特殊的地方，<strong>cellspacing属性是无法通过css来控制的</strong>。所以cellspacing只能在table里直接指定。</p>
<p><a href="http://www.w3school.com.cn/tiy/t.asp?f=html_table_cellspacing" target="_blank">http://www.w3school.com.cn/tiy/t.asp?f=html_table_cellspacing</a></p>
<h3>20.tbody</h3>
<p>熟悉html的都知道table里面可以指定thead，tfoot，tbody。这里注意的是，<strong>thead跟tfoot只能出现一次，但是tbody是可以多次出现的。也就是说你可以采用tbody来对表格的数据进行分组显示，不同的tbody分组，采用不同的css类，来显示不同的外观</strong>。</p>
<h3>21.textarea的wrap属性</h3>
<p>很奇怪的是，w3上面的属性列表里面没有提到这个wrap，但是却在注释里面详细的讲解了wrap属性。在有些我们需要控制输入的换行符号的场合，wrap就能帮上你的忙了，省去手动替换换行符号的痛苦。</p>
<blockquote><p><em>wrap=&#8221;virtual&#8221;</em> 将实现文本区内的自动换行，以改善对用户的显示，但在传输给服务器时，文本只在用户按下 Enter 键的地方进行换行，其他地方没有换行的效果。</p>
<p><em>wrap=&#8221;physical&#8221; </em>将实现文本区内的自动换行，并以这种形式传送给服务器，就像用户真的那样键入的。因为文本要以用户在文本区内看到的效果传输给服务器，因为使用自动换行是非常有用的方法。</p></blockquote>
<p><a href="http://www.w3school.com.cn/tags/tag_textarea_prop_wrap.asp" target="_blank">http://www.w3school.com.cn/tags/tag_textarea_prop_wrap.asp</a></p>
<p>此文请同步参考w3school的手册：<a href="http://www.w3school.com.cn/tags/index.asp" target="_blank">HTML 4.01 / XHTML 1.0 参考手册</a></p>
<p>后记：这里列举的很多东西，使用的不多，但是还是有不小的价值的，一直以来我自己也是一知半解。也希望借此机会好好研究一番。花了2天时间整理了这篇文章，自己也是受益良多，希望对各位也有帮助。转载请参看我<a href="http://www.fangyuqiang.com">博客</a>的版权声明，谢谢。</p>
]]></content:encoded>
			<wfw:commentRss>http://www.fangyuqiang.com/archives/548/feed</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
	</channel>
</rss>
