<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet href="http://feeds.feedburner.com/~d/styles/rss2enclosuresfull.xsl" type="text/xsl" media="screen"?><?xml-stylesheet href="http://feeds.feedburner.com/~d/styles/itemcontent.css" type="text/css" media="screen"?><rss xmlns:media="http://search.yahoo.com/mrss/" xmlns:itunes="http://www.itunes.com/dtds/podcast-1.0.dtd" xmlns:feedburner="http://rssnamespace.org/feedburner/ext/1.0" version="2.0">
<channel>
<title><![CDATA[Xoyoer's Blog]]></title>
<link>http://www.wanghaibin.com/blog/</link>
<description />
<language>zh-cn</language>
<copyright>wanghaibin.com</copyright>
<webMaster><![CDATA[xoyoer@gmail.com(Xoyoer)]]></webMaster>
<generator>PBlog2 v2.4</generator> 
<image>
	<title>Xoyoer's Blog</title>
	<url>http://www.wanghaibin.com/blog/images/logos.gif</url>
	<link>http://www.wanghaibin.com/blog/</link>
	<description>Xoyoer's Blog</description>
</image>

			<media:copyright>wanghaibin.com</media:copyright><media:category scheme="http://www.itunes.com/dtds/podcast-1.0.dtd">Arts/Design</media:category><itunes:author>xoyoer</itunes:author><itunes:explicit>no</itunes:explicit><itunes:subtitle></itunes:subtitle><itunes:category text="Arts"><itunes:category text="Design" /></itunes:category><atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="self" href="http://feeds.feedburner.com/Xoyoer" type="application/rss+xml" /><item>
			<link>http://feeds.feedburner.com/~r/Xoyoer/~3/409431429/default.asp</link>
			<title><![CDATA[电视剧《李小龙传奇》在线--主题曲：呐喊 ]]></title>
			<author>xoyoer@gmail.com (xoyoer)</author>
			<category><![CDATA[业界]]></category>
			<pubDate>Thu,02 Oct 2008 22:52:23 +0800</pubDate>
			<guid isPermaLink="false">http://www.wanghaibin.com/blog/default.asp?id=378</guid>
		<description><![CDATA[<p>电视剧《李小龙传奇》，更多资料：<a href="http://ent.sina.com.cn/f/v/lxlcq/">http://ent.sina.com.cn/f/v/lxlcq/</a>&nbsp;</p>
<p>在线DVD观看：<a href="http://play.kankan.xunlei.com/?hallid=60300&amp;pt=wmv">http://play.kankan.xunlei.com/?hallid=60300&amp;pt=wmv</a>&nbsp;</p>
<p><strong>　　片头歌曲：《呐喊》</strong></p>
<p><embed type="application/x-shockwave-flash" allowscriptaccess="sameDomain" align="middle" height="400" width="480" quality="high" src="http://player.youku.com/player.php/sid/XMzkwNDU3NTI=/v.swf"></embed></p>
<p>　　作词：裘 逸 Silvia Cortclla(意大利)</p>
<p>　　作曲：王 冰</p>
<p>　　演唱：Emma Re (谢尔维雅)(意大利)</p>
<p>　　歌词：</p>
<p>　　When life is a hard game</p>
<p>　　每当生活是一场艰苦的竟赛</p>
<p>　　Don&rsquo;t you blame</p>
<p>　　你从不抱怨</p>
<p>　　It&rsquo;s your chance to</p>
<p>　　你总会</p>
<p>　　Arise your aim</p>
<p>　　奋起你的双臂</p>
<p>　　Let your spirit be brave</p>
<p>　　以勇猛顽强的精神</p>
<p>　　Always fight to hold your name</p>
<p>　　永远为捍卫你的光荣而战</p>
<p>　　No matter how bad or rough</p>
<p>　　不管有多苦多难多艰险</p>
<p>　　You never surrender</p>
<p>　　你永不放弃</p>
<p>　　All the warriors in this world</p>
<p>　　世界上所有的勇士</p>
<p>　　Join the passion of this master of soul</p>
<p>　　无不为这伟大的心灵而心潮澎湃</p>
<p>　　From the Chinese hills and shore</p>
<p>　　从中国的高山到海岸</p>
<p>　　We still listen to Bruce Lee battle call</p>
<p>　　我们依然能听到李小龙的呐喊</p>]]></description>
		<enclosure url="http://player.youku.com/player.php/sid/XMzkwNDU3NTI=/v.swf" length="66003" type="application/x-shockwave-flash" /><media:content url="http://player.youku.com/player.php/sid/XMzkwNDU3NTI=/v.swf" fileSize="66003" type="application/x-shockwave-flash" /><itunes:explicit>no</itunes:explicit><itunes:subtitle> 电视剧《李小龙传奇》，更多资料：http://ent.sina.com.cn/f/v/lxlcq/&amp;nbsp; 在线DVD观看：http://play.kankan.xunlei.com/?hallid=60300&amp;amp;pt=wmv&amp;nbsp; 　　片头歌曲：《呐喊》 　　作词：裘 逸 Silvia Cortclla(意大利) 　　作曲：王 冰 　　演唱：Emma Re (谢尔维雅)(意大利) 　　歌词： 　　When life is a hard game 　　每当生活是一场艰苦的竟赛 　　Don</itunes:subtitle><itunes:author>xoyoer</itunes:author><itunes:summary> 电视剧《李小龙传奇》，更多资料：http://ent.sina.com.cn/f/v/lxlcq/&amp;nbsp; 在线DVD观看：http://play.kankan.xunlei.com/?hallid=60300&amp;amp;pt=wmv&amp;nbsp; 　　片头歌曲：《呐喊》 　　作词：裘 逸 Silvia Cortclla(意大利) 　　作曲：王 冰 　　演唱：Emma Re (谢尔维雅)(意大利) 　　歌词： 　　When life is a hard game 　　每当生活是一场艰苦的竟赛 　　Don&amp;rsquo;t you blame 　　你从不抱怨 　　It&amp;rsquo;s your chance to 　　你总会 　　Arise your aim 　　奋起你的双臂 　　Let your spirit be brave 　　以勇猛顽强的精神 　　Always fight to hold your name 　　永远为捍卫你的光荣而战 　　No matter how bad or rough 　　不管有多苦多难多艰险 　　You never surrender 　　你永不放弃 　　All the warriors in this world 　　世界上所有的勇士 　　Join the passion of this master of soul 　　无不为这伟大的心灵而心潮澎湃 　　From the Chinese hills and shore 　　从中国的高山到海岸 　　We still listen to Bruce Lee battle call 　　我们依然能听到李小龙的呐喊</itunes:summary><itunes:keywords>业界</itunes:keywords><feedburner:origLink>http://www.wanghaibin.com/blog/default.asp?id=378</feedburner:origLink></item>
		
			<item>
			<link>http://feeds.feedburner.com/~r/Xoyoer/~3/406789493/default.asp</link>
			<title><![CDATA[17个 Flash Gallery]]></title>
			<author>xoyoer@gmail.com (xoyoer)</author>
			<category><![CDATA[web]]></category>
			<pubDate>Tue,30 Sep 2008 09:26:52 +0800</pubDate>
			<guid isPermaLink="false">http://www.wanghaibin.com/blog/default.asp?id=377</guid>
		<description><![CDATA[<div class="content" id="textbody">
<p>曾经的ASP、PHP相册程序可能已经满足不到我们现在网络要求了，那么这17个Flash网络相册可能会带给你新的感觉吧？</p>
<p>1. <a title="Flash Gallery" href="http://www.flashgallery.org/"><font color="#006699">Flash Gallery</font></a> <a title="Flash Gallery Demo" href="http://www.flashgallery.org/demo.html" rel="nofollow"><font color="#006699">Demo.</font></a></p>
<p>2. <a href="http://tonyyoo.com/" target="_blank"><font color="#006699">Flash XML Gallery</font></a> <a title="Flash xml Galery Example" href="http://www.tonyyoo.com/gallery/gallery.html" rel="nofollow"><font color="#006699">Demo</font></a></p>
<p>3. <a title="dfGallery" href="http://www.dezinerfolio.com/2007/06/07/dfgallery/"><font color="#006699">dfGallery<br />
</font></a></p>
<p>4. <a title="Flash Page Flip Gallery" href="http://www.paulvanroekel.nl/picasa/flashpageflip/"><font color="#006699">Flash Page Flip Photo Gallery </font></a><a title="Page Flip Gallery Demo" href="http://www.paulvanroekel.nl/picasa/flashpageflipdemo/landscape/" rel="nofollow"><font color="#006699">Demo</font></a></p>
<p>5. <a href="http://www.andrewberg.com/photobrowser/afpb_flash.html" target="_blank"><font color="#006699">Flash Photo Stack Gallery</font></a></p>
<p>6. <a title="Polaroid gallery" href="http://www.no3dfx.com/polaroid/"><font color="#006699">Polaroid Gallery</font></a></p>
<p>7. <a title="Flash xml Photo viewer" href="http://www.search-this.com/tools/"><font color="#006699">Photo Viewer</font></a> <a title="Photo Viewer Demo" href="http://www.search-this.com/tools/photo-viewer/" rel="nofollow"><font color="#006699">Demo</font></a></p>
<p>8. <a title="Flash carousel slideshow" href="http://www.flshow.net/"><font color="#006699">Flash Carousel Slideshow</font></a> <a title="Carousel examples" href="http://www.flshow.net/carousel/examples/" rel="nofollow"><font color="#006699">Demo</font></a></p>
<p>9. <a title="Art flash gallery" href="http://flash-gallery.com/" rel="nofollow"><font color="#006699">Art Flash Gallery</font></a></p>
<p>10. <a title="Simple Viewer" href="http://www.airtightinteractive.com/simpleviewer/"><font color="#006699">SimpleViewer </font></a><a title="Simple Viewer Demo" href="http://www.airtightinteractive.com/photos"><font color="#006699">Demo</font></a></p>
<p>11. <a title="Tilt Viewer" href="http://www.airtightinteractive.com/projects/tiltviewer/"><font color="#006699">TiltViewer</font></a> <a title="Tilt Viewer Demo" href="http://www.airtightinteractive.com/projects/tiltviewer/app/"><font color="#006699">Demo</font></a></p>
<p>12. <a title="Auto viewer" href="http://www.airtightinteractive.com/projects/autoviewer/"><font color="#006699">AutoViewer</font></a> <a title="AutoViewer Demo" href="http://www.airtightinteractive.com/projects/autoviewer/app/"><font color="#006699">Demo</font></a></p>
<p>13. <a title="Postcard Viewer" href="http://www.airtightinteractive.com/projects/postcardviewer/"><font color="#006699">PostcardViewer</font></a> <a title="Postcard Vewer Demo" href="http://www.airtightinteractive.com/projects/postcardviewer/app/"><font color="#006699">Demo</font></a></p>
<p>14. <a title="FIG Gallery" href="http://www.flashimagegallery.com/"><font color="#006699">Flash Image Gallery</font></a> <a title="FIG Demo" href="http://www.flashimagegallery.com/demo/gallery/" rel="nofollow"><font color="#006699">Demo</font></a></p>
<p>15. <a title="Flash gallery generator" href="http://www.flashgallerygenerator.com/main.aspx"><font color="#006699">FlashGalleryGenerator</font></a> <a title="Flash Gallery Generator Demo" href="http://www.flashgallerygenerator.com/main.aspx?p=demo" rel="nofollow"><font color="#006699">Demo </font></a></p>
<p>16. <a title="Agile Gallery Flash version" href="http://www.agilegallery.com/flash-photo-gallery.html"><font color="#006699">Agile Gallery </font></a><a title="Agile gallery demo" href="http://www.agilegallery.com/flash-demo.html" rel="nofollow"><font color="#006699">Demo</font></a></p>
<p>17. <a title="Flash Gallery class" href="http://www.ideaography.net/update-fullscreen-gallery-flash-class-v2/"><font color="#006699">Gallery Flash Class v2</font></a> <a title="Gallery Flash class Demo" href="http://www.ideaography.net/fGallery/"><font color="#006699">Demo</font></a></p>
</div>]]></description>
		<feedburner:origLink>http://www.wanghaibin.com/blog/default.asp?id=377</feedburner:origLink></item>
		
			<item>
			<link>http://feeds.feedburner.com/~r/Xoyoer/~3/405315854/default.asp</link>
			<title><![CDATA[明~放假，4天~]]></title>
			<author>xoyoer@gmail.com (xoyoer)</author>
			<category><![CDATA[生存]]></category>
			<pubDate>Sun,28 Sep 2008 14:25:04 +0800</pubDate>
			<guid isPermaLink="false">http://www.wanghaibin.com/blog/default.asp?id=376</guid>
		<description><![CDATA[<p>4天&middot;~~不错不错了~</p>
<p><img alt="" src="http://www.wanghaibin.com/blog/attachments/month_0809/n200892814284.jpg" />休息。休息一会，不要着急。。。</p>]]></description>
		<feedburner:origLink>http://www.wanghaibin.com/blog/default.asp?id=376</feedburner:origLink></item>
		
			<item>
			<link>http://feeds.feedburner.com/~r/Xoyoer/~3/399935021/default.asp</link>
			<title><![CDATA[兄弟又一彪悍之作！！~~~]]></title>
			<author>xoyoer@gmail.com (xoyoer)</author>
			<category><![CDATA[生存]]></category>
			<pubDate>Mon,22 Sep 2008 19:49:30 +0800</pubDate>
			<guid isPermaLink="false">http://www.wanghaibin.com/blog/default.asp?id=374</guid>
		<description><![CDATA[小学历史得过满分的，中学当过语文课代表还经常不认识字被周禄誉为文盲的，高中开始制作签名档，展现电脑天赋并交出了处男之身的，气质与我一样优雅桀骜不驯的，长相帅气的，被鹿文原誉为神一样的男人，生日快乐。<br/><br/>【作者：刘伟】<br/>2008.09.22&nbsp;&nbsp;00：59<br/><br/><br/>----------------------------------<br/>Xoyoer 19:31:30<br/>玩会游戏不啊<br/>王菲 19:32:03<br/>我在接几天 就老不着接了呵呵<br/>----------------------------------------<br/>啊飞多保重啊~~]]></description>
		<feedburner:origLink>http://www.wanghaibin.com/blog/default.asp?id=374</feedburner:origLink></item>
		
			<item>
			<link>http://feeds.feedburner.com/~r/Xoyoer/~3/398918107/default.asp</link>
			<title><![CDATA[土豆网-黑豆上线测试，感觉不错~~]]></title>
			<author>xoyoer@gmail.com (xoyoer)</author>
			<category><![CDATA[业界]]></category>
			<pubDate>Sun,21 Sep 2008 20:07:01 +0800</pubDate>
			<guid isPermaLink="false">http://www.wanghaibin.com/blog/default.asp?id=373</guid>
		<description><![CDATA[<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 黑豆地址：<a href="http://hd.tudou.com/">http://hd.tudou.com/</a>&nbsp;，界面、清晰度感觉不错，不过有时候缓冲太严重...~和迅雷看看有的一拼，不过感觉没迅雷&ldquo;结实&rdquo;。</p>
<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 黑豆的高清在线新片~~《见龙卸甲》：<a href="http://hd.tudou.com/program/7988/">http://hd.tudou.com/program/7988/</a>&nbsp;</p>
<p>　　土豆网昨日宣布，拥有版权授予的高清频道&ldquo;黑豆&rdquo;上线公测。土豆网创始人及CEO王微透露，目前该频道正在获得较大数额的广告投放，这是这个成立三年多的视频网站首次获得大规模收入。</p>
<p>　　据介绍，黑豆具备高清播放效果，包括电视剧、电影和综艺三个频道，用户无需下载任何客户端即可免费观看。</p>
<p>　　此前土豆网是著名的UGC(用户创造内容)网站，以吸引网友上传视频而闻名，但由于上传的许多视频都缺乏正版授予，因此这些视频内容难以吸引广告主进行投放。王微表示，此次同100余家视频内容提供商进行了版权谈判，与超过百家内容伙伴成功合作，取得大量热播节目的正版授权，其内容具有程度不一的独家性和排他性，而且大部分节目通过合作伙伴获取了正版的高清画质源文件，目前已与约百家活跃广告主进行广告合作。(周婷)</p>]]></description>
		<feedburner:origLink>http://www.wanghaibin.com/blog/default.asp?id=373</feedburner:origLink></item>
		
			<item>
			<link>http://feeds.feedburner.com/~r/Xoyoer/~3/397827115/default.asp</link>
			<title><![CDATA[继续上班~懒~]]></title>
			<author>xoyoer@gmail.com (xoyoer)</author>
			<category><![CDATA[生存]]></category>
			<pubDate>Sat,20 Sep 2008 11:15:15 +0800</pubDate>
			<guid isPermaLink="false">http://www.wanghaibin.com/blog/default.asp?id=372</guid>
		<description><![CDATA[<p>继续上班~懒~</p>]]></description>
		<feedburner:origLink>http://www.wanghaibin.com/blog/default.asp?id=372</feedburner:origLink></item>
		
			<item>
			<link>http://feeds.feedburner.com/~r/Xoyoer/~3/392575280/default.asp</link>
			<title><![CDATA[080915]]></title>
			<author>xoyoer@gmail.com (xoyoer)</author>
			<category><![CDATA[生存]]></category>
			<pubDate>Mon,15 Sep 2008 03:36:16 +0800</pubDate>
			<guid isPermaLink="false">http://www.wanghaibin.com/blog/default.asp?id=371</guid>
		<description><![CDATA[<p>好久没熬夜了....昨天是中秋...</p>]]></description>
		<feedburner:origLink>http://www.wanghaibin.com/blog/default.asp?id=371</feedburner:origLink></item>
		
			<item>
			<link>http://feeds.feedburner.com/~r/Xoyoer/~3/385794015/default.asp</link>
			<title><![CDATA[1111111111111111111]]></title>
			<author>xoyoer@gmail.com (xoyoer)</author>
			<category><![CDATA[生存]]></category>
			<pubDate>Sun,07 Sep 2008 19:06:30 +0800</pubDate>
			<guid isPermaLink="false">http://www.wanghaibin.com/blog/default.asp?id=370</guid>
		<description><![CDATA[<p>1111111111111111111111111111111111111111111111111111周末！！</p>]]></description>
		<feedburner:origLink>http://www.wanghaibin.com/blog/default.asp?id=370</feedburner:origLink></item>
		
			<item>
			<link>http://feeds.feedburner.com/~r/Xoyoer/~3/382313523/default.asp</link>
			<title><![CDATA[一个Photoshop小技巧，图片大小的调整。]]></title>
			<author>xoyoer@gmail.com (xoyoer)</author>
			<category><![CDATA[web]]></category>
			<pubDate>Wed,03 Sep 2008 19:25:13 +0800</pubDate>
			<guid isPermaLink="false">http://www.wanghaibin.com/blog/default.asp?id=369</guid>
		<description><![CDATA[<p>因为看见小可爱写的FW的缩放技巧,考虑到大家肯定用PS的情况多些,所以我就写了一个PS版本的缩放图片技巧.</p>
<p>01.首先打开PS CS3 扩展版本.其他的版本也可以,不过推荐PS CS3.后面我会说下CS3的好处.<br />
操作是：图像-图像大小</p>
<p align="center"><img height="394" src="http://www.blueidea.com/articleimg/2008/09/6145/01.jpg" width="510" border="0" alt="" /></p>
<p>02.弹出的图像对话框中,会出现&quot;重定图像像素&quot;的下拉列表,打开他,可以看见很多东东,这些就是图片放大是补充像素,或者图片缩小去掉像素的算法.以前的PS版本中这里看起来非常难懂,现在每种方法后面都有了中文注解他的用途,这就是CS3的好处.<br />
我分别举例来分析下这几种缩放图片的算法</p>
<p>03.卡通图片可以使用临近的算法</p>
<p align="center"><img height="555" src="http://www.blueidea.com/articleimg/2008/09/6145/02.jpg" width="510" border="0" alt="" /></p>
<p>2次线性是PS默认的算法,可是它是一种中等质量高压缩的算法,不推荐使用.<br />
最时候的算法就是2次立方,它适合与丰富渐变色等各种复杂颜色的图片.</p>
<p align="center"><img height="675" src="http://www.blueidea.com/articleimg/2008/09/6145/03.jpg" width="437" border="0" alt="" /></p>
<p>它还有2个更棒的兄弟是2次立方较平滑适合放大图片.2次立方较锐利适合缩小图片,我一般都爱使用这种格式,锐化度得到一定提高,且图片压缩比小,质量高.</p>]]></description>
		<feedburner:origLink>http://www.wanghaibin.com/blog/default.asp?id=369</feedburner:origLink></item>
		
			<item>
			<link>http://feeds.feedburner.com/~r/Xoyoer/~3/372888046/default.asp</link>
			<title><![CDATA[跨浏览器实现float:center]]></title>
			<author>xoyoer@gmail.com (xoyoer)</author>
			<category><![CDATA[web]]></category>
			<pubDate>Sat,23 Aug 2008 23:42:25 +0800</pubDate>
			<guid isPermaLink="false">http://www.wanghaibin.com/blog/default.asp?id=368</guid>
		<description><![CDATA[<p>原文：<br />
<a href="http://www.macji.com/blog/article/to-achieve-cross-browser-css-float-center/to-achieve-cross-browser-css-float-center/" target="_blank">http://www.macji.com/blog/article/to-achieve-cross-browser-css-float-center/to-achieve-cross-browser-css-float-center/</a></p>
<p>我们都知道float:left和float:right，但是否想过float:center呢？居中浮动。。。</p>
<div class="codeText">
<div class="codeHead">XML/HTML代码</div>
<ol class="dp-xml">
    <li class="alt"><span><span class="tag">&lt;</span><span class="tag-name">div</span><span>&nbsp;</span><span class="attribute">id</span><span>=</span><span class="attribute-value">&quot;macji&quot;</span><span class="tag">&gt;</span><span>&nbsp;&nbsp;</span></span></li>
    <li><span>&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="tag">&lt;</span><span class="tag-name">ul</span><span>&nbsp;</span><span class="attribute">class</span><span>=</span><span class="attribute-value">&quot;macji-skin&quot;</span><span class="tag">&gt;</span><span>&nbsp;&nbsp;</span></li>
    <li class="alt"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="tag">&lt;</span><span class="tag-name">li</span><span class="tag">&gt;</span><span>列表一</span><span class="tag">&lt;/</span><span class="tag-name">li</span><span class="tag">&gt;</span><span>&nbsp;&nbsp;</span></li>
    <li><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="tag">&lt;</span><span class="tag-name">li</span><span class="tag">&gt;</span><span>列表二</span><span class="tag">&lt;/</span><span class="tag-name">li</span><span class="tag">&gt;</span><span>&nbsp;&nbsp;</span></li>
    <li class="alt"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="tag">&lt;</span><span class="tag-name">li</span><span class="tag">&gt;</span><span>列表三</span><span class="tag">&lt;/</span><span class="tag-name">li</span><span class="tag">&gt;</span><span>&nbsp;&nbsp;</span></li>
    <li><span>&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="tag">&lt;/</span><span class="tag-name">ul</span><span class="tag">&gt;</span><span>&nbsp;&nbsp;</span></li>
    <li class="alt"><span class="tag">&lt;/</span><span class="tag-name">div</span><span class="tag">&gt;</span><span>&nbsp;&nbsp;</span></li>
</ol>
</div>
<p>我们希望实现li是浮动的，并且居中的（li个数不固定，ul宽度未知）。可以设置ul的text-align:center,再设置li的display，可以实现居中，但这样不是我们的初衷，我们需要实现float:center。</p>
<p>这里我们得先重温一下position:relative，它将依据left，right，top，bottom等属性在正常文档流中偏移位置。那我们可以让ul为position:relative;left:50%，然后再让li像左浮动，在让它position:relative;right:50%（或者left:-50%），那么li就像向中间浮动一样居中了。废话不多说，先试试。</p>
<div class="codeText">
<div class="codeHead">CSS代码</div>
<ol class="dp-css">
    <li class="alt"><span><span class="colors">#macji</span><span>{ &nbsp;&nbsp;</span></span></li>
    <li><span>&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="keyword">position</span><span>:</span><span class="string">relative</span><span>; &nbsp;&nbsp;</span></li>
    <li class="alt"><span>&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="keyword">width</span><span>:100%; &nbsp;&nbsp;</span></li>
    <li><span>&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="keyword">height</span><span>:</span><span class="string">80px</span><span>; &nbsp;&nbsp;</span></li>
    <li class="alt"><span>&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="keyword">background-color</span><span>:</span><span class="colors">#eee</span><span>; &nbsp;&nbsp;</span></li>
    <li><span>&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="keyword">text-align</span><span>:</span><span class="string">center</span><span>; &nbsp;&nbsp;</span></li>
    <li class="alt"><span>&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="keyword">overflow</span><span>:</span><span class="string">hidden</span><span>; &nbsp;&nbsp;</span></li>
    <li><span>} &nbsp;&nbsp;</span></li>
    <li class="alt"><span class="colors">#macji</span><span>&nbsp;.macji-skin{ &nbsp;&nbsp;</span></li>
    <li><span>&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="keyword">float</span><span>:</span><span class="string">left</span><span>; &nbsp;&nbsp;</span></li>
    <li class="alt"><span>&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="keyword">position</span><span>:</span><span class="string">relative</span><span>; &nbsp;&nbsp;</span></li>
    <li><span>&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="string">left</span><span>:50%; &nbsp;&nbsp;</span></li>
    <li class="alt"><span>} &nbsp;&nbsp;</span></li>
    <li><span class="colors">#macji</span><span>&nbsp;.macji-skin&nbsp;li{ &nbsp;&nbsp;</span></li>
    <li class="alt"><span>&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="keyword">position</span><span>:</span><span class="string">relative</span><span>; &nbsp;&nbsp;</span></li>
    <li><span>&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="keyword">right</span><span class="string">right</span><span>:50%; &nbsp;&nbsp;</span></li>
    <li class="alt"><span>&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="keyword">float</span><span>:</span><span class="string">left</span><span>; &nbsp;&nbsp;</span></li>
    <li><span>&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="keyword">margin</span><span>:</span><span class="string">10px</span><span>; &nbsp;&nbsp;</span></li>
    <li class="alt"><span>&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="keyword">padding</span><span>:0&nbsp;</span><span class="string">10px</span><span>; &nbsp;&nbsp;</span></li>
    <li><span>&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="keyword">border</span><span>:</span><span class="string">solid</span><span>&nbsp;</span><span class="string">1px</span><span>&nbsp;</span><span class="colors">#000</span><span>; &nbsp;&nbsp;</span></li>
    <li class="alt"><span>&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="keyword">line-height</span><span>:</span><span class="string">60px</span><span>; &nbsp;&nbsp;</span></li>
    <li><span>} &nbsp;&nbsp;</span></li>
</ol>
</div>
<p align="center"><strong><a href="http://www.blueidea.com/articleimg/2008/08/6130/float-center.htm" target="_blank"><strong>查看演示</strong></a></strong></p>
<p>扩展阅读：<br />
<a href="http://matthewjamestaylor.com/blog/beautiful-css-centered-menus-no-hacks-full-cross-browser-support" target="_blank">http://matthewjamestaylor.com/blog/beautiful-css-centered-menus-no-hacks-full-cross-browser-support</a></p>]]></description>
		<feedburner:origLink>http://www.wanghaibin.com/blog/default.asp?id=368</feedburner:origLink></item>
		
<media:credit role="author">xoyoer</media:credit><media:rating>nonadult</media:rating></channel>
</rss>
