<?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>94smart&#039;s Blog &#187; CSS Sprites</title>
	<atom:link href="http://blog.94smart.com/tags/css-sprites/feed" rel="self" type="application/rss+xml" />
	<link>http://blog.94smart.com</link>
	<description>移动或移不动的互联网</description>
	<lastBuildDate>Thu, 09 Feb 2012 09:50:41 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3</generator>
		<item>
		<title>原来是CSS Sprites呀</title>
		<link>http://blog.94smart.com/cache/2007/1008_1200.html</link>
		<comments>http://blog.94smart.com/cache/2007/1008_1200.html#comments</comments>
		<pubDate>Mon, 08 Oct 2007 03:39:10 +0000</pubDate>
		<dc:creator>94smart</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[Google]]></category>
		<category><![CDATA[XHTML]]></category>
		<category><![CDATA[Yahoo]]></category>
		<category><![CDATA[网站设计]]></category>
		<category><![CDATA[随笔]]></category>
		<category><![CDATA[CSS Sprites]]></category>

		<guid isPermaLink="false">http://blog.94smart.com/2007/10/08/1200.html</guid>
		<description><![CDATA[最近一阵国内Blogger开始涉及CSS Sprites，是因为有人偶然发现Google搜索首页JS的秘密，之后我才知道去年Yahoo改版使用的技术原来就是这个，当时不知道怎么形容，只好套用软件资源图片的概念，看过Realazy的文章才大致理解，发现自己当时的理解还是太浅显，这是早在2005年就出现的技术呀。 不可否认，这种方法确实减少了CSS文件里的HTTP请求数，但是图片的更新和配置比较有难度，且半透明和不透明图片最好分开打包。 最后，也许是我胡思乱想，这种方法如果继续发展下去，完全可以省去前端操作人员（网页制作、编辑）用Photoshop切割图片的工序，会否变成引用原设计图直接作为资源图片呢？ Technorati : CSS, CSS Sprites, Google, XHTML, Yahoo<table class="wumii-related-items" cellspacing="0" cellpadding="3" border="0"  style="clear: both;">
    
    <tr>
        <td colspan="5"><b><font size="-1"  style="display: block !important; padding: 20px 0 5px !important;">您可能也喜欢：</font></b></td>
    </tr>
    
        <tr>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important;">
                    <a target="_blank" title="别紧张，只是CSS裸奔节又到了" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2008%2F0409_1232.html&from=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2007%2F1008_1200.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/05/12/8526827.png" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">别紧张，只是CSS裸奔节又到了</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="新版Yahoo首页：用软件的方式做网站" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2006%2F0721_821.html&from=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2007%2F1008_1200.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/images/blogWidget/wordpress_default.gif" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">新版Yahoo首页：用软件的方式做网站</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="用XHTML+CSS实现文章列表标题时间对齐" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2007%2F0305_1096.html&from=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2007%2F1008_1200.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/04/29/7088198.gif" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">用XHTML+CSS实现文章列表标题时间对齐</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="赶上CSS裸体节" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2007%2F0405_1137.html&from=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2007%2F1008_1200.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/04/29/7088196.png" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">赶上CSS裸体节</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="关于网页设计和CSS+XHTML" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2006%2F0427_707.html&from=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2007%2F1008_1200.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/images/blogWidget/wordpress_default.gif" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">关于网页设计和CSS+XHTML</font>
                    </a>
                </td>
        </tr>
    
    <tr>
        <td colspan="5" align="right">
            <a style="text-decoration: none !important;" href="http://www.wumii.com/widget/relatedItems.htm" target="_blank" title="无觅相关文章插件">
                <font size="-1" color="#bbbbbb" style="display: block !important; font-family: arial !important; padding: 5px 0 !important; font-size: 12px !important; color: #bbb !important;">无觅</font>
            </a>
        </td>
    </tr>
</table>]]></description>
			<content:encoded><![CDATA[<p>最近一阵国内Blogger开始涉及CSS Sprites，是因为有人偶然发现<a href="http://www.marchbox.com/blog/css-sprite-in-google-search/" target="_blank">Google搜索首页JS的秘密</a>，之后我才知道<a href="http://blog.94smart.com/2006/07/21/821.html" target="_blank">去年Yahoo改版使用的技术</a>原来就是这个，当时不知道怎么形容，只好套用软件资源图片的概念，看过<a href="http://realazy.org/blog/2007/10/08/css-sprites/" target="_blank">Realazy的文章</a>才大致理解，发现自己当时的理解还是太浅显，这是早在2005年就出现的技术呀。</p>
<p>不可否认，这种方法确实减少了CSS文件里的HTTP请求数，但是图片的更新和配置比较有难度，且半透明和不透明图片最好分开打包。</p>
<p>最后，也许是我胡思乱想，这种方法如果继续发展下去，完全可以省去前端操作人员（网页制作、编辑）用Photoshop切割图片的工序，会否变成引用原设计图直接作为资源图片呢？</p>
<p class="zoundry_bw_tags">   <!-- Tag links generated by Zoundry Blog Writer. Do not manually edit. <a href="http://www.zoundry.com" rel="nofollow">http://www.zoundry.com</a> --><br />
<span class="ztags"><span class="ztagspace">Technorati</span> : <a href="http://technorati.com/tag/CSS" class="ztag" rel="tag">CSS</a>, <a href="http://technorati.com/tag/CSS%20Sprites" class="ztag" rel="tag">CSS Sprites</a>, <a href="http://technorati.com/tag/Google" class="ztag" rel="tag">Google</a>, <a href="http://technorati.com/tag/XHTML" class="ztag" rel="tag">XHTML</a>, <a href="http://technorati.com/tag/Yahoo" class="ztag" rel="tag">Yahoo</a></span></p>
<table class="wumii-related-items" cellspacing="0" cellpadding="3" border="0"  style="clear: both;">
    
    <tr>
        <td colspan="5"><b><font size="-1"  style="display: block !important; padding: 20px 0 5px !important;">您可能也喜欢：</font></b></td>
    </tr>
    
        <tr>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important;">
                    <a target="_blank" title="别紧张，只是CSS裸奔节又到了" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2008%2F0409_1232.html&from=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2007%2F1008_1200.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/05/12/8526827.png" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">别紧张，只是CSS裸奔节又到了</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="新版Yahoo首页：用软件的方式做网站" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2006%2F0721_821.html&from=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2007%2F1008_1200.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/images/blogWidget/wordpress_default.gif" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">新版Yahoo首页：用软件的方式做网站</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="用XHTML+CSS实现文章列表标题时间对齐" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2007%2F0305_1096.html&from=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2007%2F1008_1200.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/04/29/7088198.gif" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">用XHTML+CSS实现文章列表标题时间对齐</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="赶上CSS裸体节" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2007%2F0405_1137.html&from=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2007%2F1008_1200.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/04/29/7088196.png" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">赶上CSS裸体节</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="关于网页设计和CSS+XHTML" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2006%2F0427_707.html&from=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2007%2F1008_1200.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/images/blogWidget/wordpress_default.gif" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">关于网页设计和CSS+XHTML</font>
                    </a>
                </td>
        </tr>
    
    <tr>
        <td colspan="5" align="right">
            <a style="text-decoration: none !important;" href="http://www.wumii.com/widget/relatedItems.htm" target="_blank" title="无觅相关文章插件">
                <font size="-1" color="#bbbbbb" style="display: block !important; font-family: arial !important; padding: 5px 0 !important; font-size: 12px !important; color: #bbb !important;">无觅</font>
            </a>
        </td>
    </tr>
</table>]]></content:encoded>
			<wfw:commentRss>http://blog.94smart.com/cache/2007/1008_1200.html/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>新版Yahoo首页：用软件的方式做网站</title>
		<link>http://blog.94smart.com/cache/2006/0721_821.html</link>
		<comments>http://blog.94smart.com/cache/2006/0721_821.html#comments</comments>
		<pubDate>Fri, 21 Jul 2006 15:54:40 +0000</pubDate>
		<dc:creator>94smart</dc:creator>
				<category><![CDATA[互联网]]></category>
		<category><![CDATA[网站设计]]></category>
		<category><![CDATA[随笔]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[CSS Sprites]]></category>
		<category><![CDATA[IM]]></category>
		<category><![CDATA[Yahoo]]></category>
		<category><![CDATA[网站]]></category>

		<guid isPermaLink="false">http://blog.94smart.com/2006/07/21/821.html</guid>
		<description><![CDATA[Yahoo的新版首页终于完整公布了，修改了部分设置，基于好奇的原因，小小研究了一下。 说得夸张点，Yahoo在用写软件的方式做网站。包括： Yahoo在UI上的操作，比如换配色，虽然也有别的网站使用，但是从操作上，Yahoo的处理更像是软件的方式，有点像现在的Windows Live Messenger的换色操作。 图片的调用跟软件的一种图片资源操作如出一辙，软件对图片资源有一种使用方法&#8221;将所有图片放在一张图片里，使用相应的位置坐标调用&#8221;，Yahoo的做法很类似，页面上的图标、背景图都是来自于一张大图（图标资源1、图标资源2、背景图资源），使用CSS定义范围来显示相应图片，这么做确实有好处，可以方便预先读取和集中管理图片资源。 其实前两天就想写这个内容的，但是最近我的Dreamhost空间极度不稳定，导致未能及时发布，今天在发的时候又忘了点当时想写的地方，只好凑合了。 Technorati : CSS, homepage, software, yahoo<table class="wumii-related-items" cellspacing="0" cellpadding="3" border="0"  style="clear: both;">
    
    <tr>
        <td colspan="5"><b><font size="-1"  style="display: block !important; padding: 20px 0 5px !important;">您可能也喜欢：</font></b></td>
    </tr>
    
        <tr>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important;">
                    <a target="_blank" title="用XHTML+CSS实现文章列表标题时间对齐" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2007%2F0305_1096.html&from=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2006%2F0721_821.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/04/29/7088198.gif" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">用XHTML+CSS实现文章列表标题时间对齐</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="GameSpot越来越2" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2006%2F0313_649.html&from=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2006%2F0721_821.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/04/29/7094631.jpg" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">GameSpot越来越2</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="赶上CSS裸体节" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2007%2F0405_1137.html&from=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2006%2F0721_821.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/04/29/7088196.png" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">赶上CSS裸体节</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="Opera Mini 2.0，用手机上网" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2006%2F0528_749.html&from=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2006%2F0721_821.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/images/blogWidget/wordpress_default.gif" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">Opera Mini 2.0，用手机上网</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="Yahoo新首页不见了" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2006%2F0316_654.html&from=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2006%2F0721_821.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/04/29/7099339.jpg" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">Yahoo新首页不见了</font>
                    </a>
                </td>
        </tr>
    
    <tr>
        <td colspan="5" align="right">
            <a style="text-decoration: none !important;" href="http://www.wumii.com/widget/relatedItems.htm" target="_blank" title="无觅相关文章插件">
                <font size="-1" color="#bbbbbb" style="display: block !important; font-family: arial !important; padding: 5px 0 !important; font-size: 12px !important; color: #bbb !important;">无觅</font>
            </a>
        </td>
    </tr>
</table>]]></description>
			<content:encoded><![CDATA[<p>Yahoo的新版首页终于完整公布了，修改了部分设置，基于好奇的原因，小小研究了一下。</p>
<p>说得夸张点，Yahoo在用写软件的方式做网站。包括：</p>
<ol>
<li>Yahoo在UI上的操作，比如换配色，虽然也有别的网站使用，但是从操作上，Yahoo的处理更像是软件的方式，有点像现在的Windows Live Messenger的换色操作。</li>
<li>图片的调用跟软件的一种图片资源操作如出一辙，软件对图片资源有一种使用方法&#8221;将所有图片放在一张图片里，使用相应的位置坐标调用&#8221;，Yahoo的做法很类似，页面上的图标、背景图都是来自于一张大图（<a href="http://us.i1.yimg.com/us.yimg.com/i/ww/thm/1/trough_1.3.gif">图标资源1</a>、<a href="http://us.i1.yimg.com/us.yimg.com/i/ww/thm/1/icons_1.1.gif">图标资源2</a>、<a href="http://us.i1.yimg.com/us.yimg.com/i/ww/thm/1/grd-1px_1.1.gif">背景图资源</a>），使用CSS定义范围来显示相应图片，这么做确实有好处，可以方便预先读取和集中管理图片资源。</li>
</ol>
<p>其实前两天就想写这个内容的，但是最近我的Dreamhost空间极度不稳定，导致未能及时发布，今天在发的时候又忘了点当时想写的地方，只好凑合了。</p>
<p>Technorati : <a href="http://technorati.com/tag/CSS" rel="tag">CSS</a>, <a href="http://technorati.com/tag/homepage" rel="tag">homepage</a>, <a href="http://technorati.com/tag/software" rel="tag">software</a>, <a href="http://technorati.com/tag/yahoo" rel="tag">yahoo</a></p>
<table class="wumii-related-items" cellspacing="0" cellpadding="3" border="0"  style="clear: both;">
    
    <tr>
        <td colspan="5"><b><font size="-1"  style="display: block !important; padding: 20px 0 5px !important;">您可能也喜欢：</font></b></td>
    </tr>
    
        <tr>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important;">
                    <a target="_blank" title="用XHTML+CSS实现文章列表标题时间对齐" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2007%2F0305_1096.html&from=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2006%2F0721_821.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/04/29/7088198.gif" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">用XHTML+CSS实现文章列表标题时间对齐</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="GameSpot越来越2" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2006%2F0313_649.html&from=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2006%2F0721_821.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/04/29/7094631.jpg" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">GameSpot越来越2</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="赶上CSS裸体节" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2007%2F0405_1137.html&from=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2006%2F0721_821.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/04/29/7088196.png" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">赶上CSS裸体节</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="Opera Mini 2.0，用手机上网" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2006%2F0528_749.html&from=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2006%2F0721_821.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/images/blogWidget/wordpress_default.gif" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">Opera Mini 2.0，用手机上网</font>
                    </a>
                </td>
                <td width="102" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="Yahoo新首页不见了" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2006%2F0316_654.html&from=http%3A%2F%2Fblog.94smart.com%2Fcache%2F2006%2F0721_821.html">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 96px !important; height: 96px !important;" src="http://static.wumii.com/site_images/2011/04/29/7099339.jpg" width="96px" height="96px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 102px !important; font: 12px/15px arial !important; height: 60px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">Yahoo新首页不见了</font>
                    </a>
                </td>
        </tr>
    
    <tr>
        <td colspan="5" align="right">
            <a style="text-decoration: none !important;" href="http://www.wumii.com/widget/relatedItems.htm" target="_blank" title="无觅相关文章插件">
                <font size="-1" color="#bbbbbb" style="display: block !important; font-family: arial !important; padding: 5px 0 !important; font-size: 12px !important; color: #bbb !important;">无觅</font>
            </a>
        </td>
    </tr>
</table>]]></content:encoded>
			<wfw:commentRss>http://blog.94smart.com/cache/2006/0721_821.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

