<?xml version="1.0" encoding="utf-8"?><?xml-stylesheet href='http://feed.leeiio.me/styles/temp01.xsl' type='text/xsl' ?><!--这是一个由Feedsy提供技术支持的Feed，为了提高读者阅读的体验，以及满足用户美化自己Feed的需要，我们设计了多种精美的Feed模板，提供给大家选择，所有最终呈现出来的样式，皆由用户自愿选择使用，未经许可，任何团体和个人，请不要擅自修改样式或者盗用，这是对于用户选择权的尊重。--><rss xmlns:atom="http://www.w3.org/2005/Atom" xmlns:fs="http://www.feedsky.com/namespace/feed" xmlns:sy="http://purl.org/rss/1.0/modules/syndication/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:wfw="http://wellformedweb.org/CommentAPI/" xmlns:slash="http://purl.org/rss/1.0/modules/slash/" xmlns:dc="http://purl.org/dc/elements/1.1/" version="2.0"><channel><atom:link href="http://feed.leeiio.me" type="application/rss+xml" rel="self"></atom:link><fs:self_link href="http://feed.feedsky.com/1studio" type="application/rss+xml"></fs:self_link><lastBuildDate>Thu, 26 Aug 2010 12:29:27 GMT</lastBuildDate><title>Leeiio™ Chaos Made.</title><description>混沌制造。音乐，设计，摄影。</description><image><url>http://www.feedsky.com/feed/1studio/sc/gif</url><title>Leeiio™ Chaos Made.</title><link>http://leeiio.me</link></image><link>http://leeiio.me</link><sy:updatePeriod>hourly</sy:updatePeriod><sy:updateFrequency>1</sy:updateFrequency><language>en</language><pubDate>Thu, 26 Aug 2010 12:29:27 GMT</pubDate><item><title>再谈谈文本编辑器Vim</title><link>http://leeiio.me/talk-about-vim/</link><content:encoded>&lt;p class=&quot;fswww1&quot;&gt;&lt;a href=&quot;http://www1.feedsky.com/r/l/feedsky/1studio/406711529/art01.html&quot; target=&quot;_blank&quot;&gt;&lt;img border=&quot;0&quot; ismap=&quot;ismap&quot; src=&quot;http://www1.feedsky.com/r/i/feedsky/1studio/406711529/art01.gif&quot; onerror=&quot;this.style.display='none'&quot; /&gt;&lt;/a&gt;&lt;/p&gt;&lt;p&gt;&lt;img src=&quot;http://imgs.leeiio.me/blogimgs/2010/08/20100826_talkaboutvim.png&quot; alt=&quot;再谈谈文本编辑器Vim&quot; /&gt;&lt;br /&gt;
早前写过一篇&lt;a href=&quot;http://leeiio.me/vim-novice/&quot;&gt;《VIM 新手上路》&lt;/a&gt;，算是个基础，让你面对VIM不再觉得这是一个多么反人类的编辑器啊。把VIM打造成了一般的文本编辑器的模样之后，如果想要使用的更加顺手，你知道，是需要安装很多实用的插件和修改你的配置文件的。之前我因工作需要在Windows操作系统下，所以我用的是&lt;a href=&quot;http://www.vim.org/download.php#pc&quot; rel=&quot;nofollow&quot;&gt;gVIM&lt;/a&gt;，现在同样是因为工作需要，我用的是&lt;a href=&quot;http://github.com/b4winckler/macvim&quot; rel=&quot;nofollow&quot;&gt;MacVim&lt;/a&gt;，这两个都是Vim的不同系统下的GUI版本。&lt;br /&gt;
&lt;span id=&quot;more-2129&quot;&gt;&lt;/span&gt;&lt;br /&gt;
当然因为操作系统的问题，&lt;a href=&quot;http://www.vim.org/download.php#pc&quot; rel=&quot;nofollow&quot;&gt;gVIM&lt;/a&gt;和&lt;a href=&quot;http://github.com/b4winckler/macvim&quot; rel=&quot;nofollow&quot;&gt;MacVim&lt;/a&gt;在配置上是会有些细微差别的，所以在写配置的时候需要做判断，这里你可以参考我的VIMRC配置，使用HG的朋友可以folow我的在&lt;a href=&quot;http://bitbucket.org/leeiio/vim&quot; rel=&quot;nofollow&quot;&gt;Bitbucket上的Vim项目&lt;/a&gt;，使用Git的可以watch我在&lt;a href=&quot;http://github.com/leeiio/vim&quot; rel=&quot;nofollow&quot;&gt;Github上的VIM项目&lt;/a&gt;。&lt;/p&gt;
&lt;p&gt;前段时间VIM升级到了7.3，除了带来不少的新特性，性能也有提升，不过因为&lt;a href=&quot;http://github.com/b4winckler/macvim&quot; rel=&quot;nofollow&quot;&gt;MacVim&lt;/a&gt;是第三方编译维护的，所以MacVim 7.3版本会发现有些小问题，比如原来的透明度设置无效了，以及上下移动文本的时候会发现有残影，期待作者的修正版本。所以我还是用的MacVim 7.2版本。&lt;/p&gt;
&lt;p&gt;闲耘同学的&lt;a href=&quot;http://hotoo.github.com/vimwiki/Vim.html&quot; rel=&quot;nofollow&quot;&gt;Wiki&lt;/a&gt;上收集了不少Vim的使用技巧和心得，是大家学习Vim值得关注的一个地方。都说Vim的学习曲线非常的陡，其实不假，我从写完上篇&lt;a href=&quot;http://leeiio.me/vim-novice/&quot;&gt;《VIM 新手上路》&lt;/a&gt;后的一段时间，也并不是一直在使用Vim，因为一些种种的不适应中间也是冷落过Vim的，毕竟Windows下有不少好用的文本编辑器，类似Notepad++和Sublime Text以及EditPlus等等等，Mac下有Coda，espresso，Textmate等等等。虽然倒现在我还是觉得Vim在查找文件方便我怎么都不顺手，虽然grep和vimgrep命令很强大，可是大部分IDE或者说是文本编辑器提供的项目搜索功能都很方便，且能快速定位到该文件，但是Vim目前已经再次成为了我的主力文本编辑器，并且我也在怂恿身边的一些朋友尝试下Vim。&lt;/p&gt;
&lt;p&gt;Vim是键盘流的大爱，因为大部分操作都可以通过快捷键来操作实现，那么可能你就需要记忆很多的快捷键了，当然熟能生巧是记忆的一种方式，查手册也是不错的记忆方式，你查的多了，用得多了，其实自然而然就熟络了。:help命令是学习Vim不可不用得命令之一，当然默认他是英文的，不过在Sourceforge上有一个Vimcdoc的项目提供了&lt;a href=&quot;http://vimcdoc.sourceforge.net/&quot; rel=&quot;nofollow&quot;&gt;Vim的中文文档&lt;/a&gt;支持，你只要安装了中文文档，再次使用:help命令的时候它显示的就是中文帮助了。&lt;/p&gt;
&lt;p&gt;&lt;a href=&quot;http://blog.vgod.tw/go.php?http://people.csail.mit.edu/vgod/vim/vim-cheat-sheet-en.png&quot; rel=&quot;nofollow&quot; title=&quot;戳我打开大图&quot;&gt;&lt;img src=&quot;http://blog.vgod.tw/go.php?http://people.csail.mit.edu/vgod/vim/vim-cheat-sheet-en.png&quot; width=&quot;500&quot; alt=&quot;Vim操作学习图例&quot; /&gt;&lt;/a&gt;&lt;br /&gt;
这张图片我觉得非常适合Vim新手入门，并且忘记的时候还可以时常看看，非常直观。这里还有&lt;a href=&quot;http://blog.vgod.tw/go.php?http://people.csail.mit.edu/vgod/vim/vim-cheat-sheet-en.pdf&quot; rel=&quot;nofollow&quot;&gt;Vim入门图解的PDF版本&lt;/a&gt;，方便你打印下来查看。&lt;/p&gt;
&lt;p&gt;当你慢慢开始学着用Vim的时候，你会发现Vim真的太棒了，千万不要忘了，它还是一款开源的文本编辑器。Vim还是一款有趣的文本编辑器，看看它的彩蛋，当你输入:help 42和:h!，发现了么？当然Vim目前还不能用来洗盘子，这是作者对大家说抱歉的地方。&lt;/p&gt;
&lt;p&gt;这个世界其实并不存在一款完美的文本编辑器，因为我常常看到一大群人在为自己使用的文本编辑器比别人的好而喋喋争论不休，其实最典型的用户群是Emacs用户和Vim用户，似乎两个阵营的人有不共戴天之仇一般，当然最终谁都是无法说服对方的，通常的争论都是如此。适合你用的文本编辑器才是最好的文本编辑器。&lt;/p&gt;
&lt;p&gt;文中提及资源：&lt;br /&gt;
&lt;a href=&quot;http://www.vim.org/download.php#pc&quot; rel=&quot;nofollow&quot;&gt;gVIM&lt;/a&gt;&lt;br /&gt;
&lt;a href=&quot;http://github.com/b4winckler/macvim&quot; rel=&quot;nofollow&quot;&gt;MacVim&lt;/a&gt;&lt;br /&gt;
&lt;a href=&quot;http://bitbucket.org/leeiio/vim&quot; rel=&quot;nofollow&quot;&gt;我的在Bitbucket上的Vim配置项目&lt;/a&gt;&lt;br /&gt;
&lt;a href=&quot;http://github.com/leeiio/vim&quot; rel=&quot;nofollow&quot;&gt;我的在Github上的Vim配置项目&lt;/a&gt;&lt;br /&gt;
&lt;a href=&quot;http://hotoo.github.com/vimwiki/Vim.html&quot; rel=&quot;nofollow&quot;&gt;闲耘同学的关于Vim的Wiki&lt;/a&gt;&lt;br /&gt;
&lt;a href=&quot;http://vimcdoc.sourceforge.net/&quot; rel=&quot;nofollow&quot;&gt;Vim的中文文档&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;本文地址:&lt;a href=&quot;http://leeiio.me/talk-about-vim/&quot;&gt;http://leeiio.me/talk-about-vim/&lt;a&gt;&lt;/p&gt;截至您的阅读器抓取时已有评论&lt;strong&gt; 2 &lt;/strong&gt;条,欢迎您也过来留下您的意见 !&lt;hr /&gt;©Copyright 2007-2009 Leeiio Chaos Made &lt;a href=&quot;http://leeiio.me&quot; target=&quot;_blank&quot;&gt;http://Leeiio.me&lt;/a&gt;&lt;br /&gt;&lt;font style=&quot;font-size:15px;font-weight:bold&quot;&gt;本站更換RSS地址：&lt;a href=&quot;http://feed.leeiio.me&quot; title=&quot;戳我訂閱最新rss地址&quot;&gt;&lt;font color=&quot;red&quot;&gt;http://feed.leeiio.me&lt;/font&gt;&lt;/a&gt;，麻煩大家更新下，謝謝！&lt;/font&gt;&lt;br /&gt;
&lt;p&gt;&lt;strong&gt;声明:&lt;/strong&gt; 本站遵循 &lt;a href=&quot;http://creativecommons.org/licenses/by-nc-sa/3.0/&quot;&gt;署名-非商业性使用-相同方式共享 3.0&lt;/a&gt; 共享协议. 转载请注明转自 &lt;a href=&quot;http://leeiio.me&quot;&gt;Leeiio.me&lt;/a&gt;
&lt;img src=&quot;http://img.tongji.linezing.com/990626/tongji.gif&quot;/&gt;&lt;/p&gt; &lt;ul class=&quot;related_post&quot;&gt;&lt;li&gt;&lt;a href=&quot;http://leeiio.me/zen-coding-in-vim/&quot; title=&quot;在Vim里玩Zen Coding&quot;&gt;在Vim里玩Zen Coding&lt;/a&gt; (25)&lt;/li&gt;&lt;li&gt;&lt;a href=&quot;http://leeiio.me/vim-novice/&quot; title=&quot;Vim 新手上路&quot;&gt;Vim 新手上路&lt;/a&gt; (57)&lt;/li&gt;&lt;/ul&gt;&lt;img src=&quot;http://www1.feedsky.com/t1/406711529/1studio/feedsky/s.gif?r=http://leeiio.me/talk-about-vim/&quot; border=&quot;0&quot; height=&quot;0&quot; width=&quot;0&quot; style=&quot;position:absolute&quot; /&gt;</content:encoded><wfw:commentRss>http://leeiio.me/talk-about-vim/feed/</wfw:commentRss><slash:comments>2</slash:comments><description>&lt;p class=&quot;fswww1&quot;&gt;&lt;a href=&quot;http://www1.feedsky.com/r/l/feedsky/1studio/406711529/art01.html&quot; target=&quot;_blank&quot;&gt;&lt;img border=&quot;0&quot; ismap=&quot;ismap&quot; src=&quot;http://www1.feedsky.com/r/i/feedsky/1studio/406711529/art01.gif&quot; onerror=&quot;this.style.display='none'&quot; /&gt;&lt;/a&gt;&lt;/p&gt;早前写过一篇《VIM 新手上路》，算是个基础，让你面对VIM不再觉得这是一个多么反人类的编辑器啊。把VIM打造成了一般的文本编辑器的模样之后，如果想要使用的更加顺手，你知道，是需要安装很多实用的插件和修改你的配置文件的。之前我因工作需要在Windows操作系统下，所以我用的是gVIM，现在同样是因为工作需要，我用的是MacVim，这两个都是Vim的不同系统下的GUI版本。 当然因为操作系统的问题，gVIM和MacVim在配置上是会有些细微差别的，所以在写配置的时候需要做判断，这里你可以参考我的VIMRC配置，使用HG的朋友可以folow我的在Bitbucket上的Vim项目，使用Git的可以watch我在Github上的VIM项目。 前段时间VIM升级到了7.3，除了带来不少的新特性，性能也有提升，不过因为MacVim是第三方编译维护的，所以MacVim 7.3版本会发现有些小问题，比如原来的透明度设置无效了，以及上下移动文本的时候会发现有残影，期待作者的修正版本。所以我还是用的MacVim 7.2版本。 闲耘同学的Wiki上收集了不少Vim的使用技巧和心得，是大家学习Vim值得关注的一个地方。都说Vim的学习曲线非常的陡，其实不假，我从写完上篇《VIM 新手上路》后的一段时间，也并不是一直在使用Vim，因为一些种种的不适应中间也是冷落过Vim的，毕竟Windows下有不少好用的文本编辑器，类似Notepad++和Sublime Text以及EditPlus等等等，Mac下有Coda，espresso，Textmate等等等。虽然倒现在我还是觉得Vim在查找文件方便我怎么都不顺手，虽然grep和vimgrep命令很强大，可是大部分IDE或者说是文本编辑器提供的项目搜索功能都很方便，且能快速定位到该文件，但是Vim目前已经再次成为了我的主力文本编辑器，并且我也在怂恿身边的一些朋友尝试下Vim。 Vim是键盘流的大爱，因为大部分操作都可以通过快捷键来操作实现，那么可能你就需要记忆很多的快捷键了，当然熟能生巧是记忆的一种方式，查手册也是不错的记忆方式，你查的多了，用得多了，其实自然而然就熟络了。:help命令是学习Vim不可不用得命令之一，当然默认他是英文的，不过在Sourceforge上有一个Vimcdoc的项目提供了Vim的中文文档支持，你只要安装了中文文档，再次使用:help命令的时候它显示的就是中文帮助了。 这张图片我觉得非常适合Vim新手入门，并且忘记的时候还可以时常看看，非常直观。这里还有Vim入门图解的PDF版本，方便你打印下来查看。 当你慢慢开始学着用Vim的时候，你会发现Vim真的太棒了，千万不要忘了，它还是一款开源的文本编辑器。Vim还是一款有趣的文本编辑器，看看它的彩蛋，当你输入:help 42和:h!，发现了么？当然Vim目前还不能用来洗盘子，这是作者对大家说抱歉的地方。 这个世界其实并不存在一款完美的文本编辑器，因为我常常看到一大群人在为自己使用的文本编辑器比别人的好而喋喋争论不休，其实最典型的用户群是Emacs用户和Vim用户，似乎两个阵营的人有不共戴天之仇一般，当然最终谁都是无法说服对方的，通常的争论都是如此。适合你用的文本编辑器才是最好的文本编辑器。 文中提及资源： gVIM MacVim 我的在Bitbucket上的Vim配置项目 我的在Github上的Vim配置项目 闲耘同学的关于Vim的Wiki Vim的中文文档 本文地址:http://leeiio.me/talk-about-vim/截至您的阅读器抓取时已有评论 2 条,欢迎您也过来留下您的意见 !©Copyright 2007-2009 Leeiio Chaos Made http://Leeiio.me本站更換RSS地址：http://feed.leeiio.me，麻煩大家更新下，謝謝！ 声明: 本站遵循 署名-非商业性使用-相同方式共享 3.0 共享协议. 转载请注明转自 Leeiio.me 在Vim里玩Zen Coding (25)Vim 新手上路 (57)&lt;img src=&quot;http://www1.feedsky.com/t1/406711529/1studio/feedsky/s.gif?r=http://leeiio.me/talk-about-vim/&quot; border=&quot;0&quot; height=&quot;0&quot; width=&quot;0&quot; style=&quot;position:absolute&quot; /&gt;</description><category>設計資源</category><category>Vim</category><category>MacVim</category><pubDate>Thu, 26 Aug 2010 20:29:27 +0800</pubDate><author>Leeiio</author><comments>http://leeiio.me/talk-about-vim/#comments</comments><guid isPermaLink="false">http://leeiio.me/?p=2129</guid><dc:creator>Leeiio</dc:creator><fs:srclink>http://leeiio.me/talk-about-vim/</fs:srclink><fs:srcfeed>http://leeiio.me/feed/</fs:srcfeed><fs:itemid>feedsky/1studio/~7316938/406711529/4400837</fs:itemid></item><item><title>水果出没,人才请注意！</title><link>http://leeiio.me/doit-im-jobs/</link><content:encoded>&lt;p class=&quot;fswww1&quot;&gt;&lt;a href=&quot;http://www1.feedsky.com/r/l/feedsky/1studio/406711530/art01.html&quot; target=&quot;_blank&quot;&gt;&lt;img border=&quot;0&quot; ismap=&quot;ismap&quot; src=&quot;http://www1.feedsky.com/r/i/feedsky/1studio/406711530/art01.gif&quot; onerror=&quot;this.style.display='none'&quot; /&gt;&lt;/a&gt;&lt;/p&gt;&lt;p&gt;&lt;img src=&quot;http://imgs.leeiio.me/blogimgs/2010/08/20100802_doitimoffice.jpg&quot; alt=&quot;Doit.im office&quot; /&gt;&lt;br /&gt;
同样作为一家水果公司SnowOrange(杭州雪橙网络科技有限公司)，我表示鸭梨很大，如何在同类水果中脱颖而出是我们正在奋斗的事业。&lt;br /&gt;
提供专业的任务及时间管理服务是我们的事业，目的就是让大家更合理安排时间，提升工作效率；更加宏观的看待工作，让您尽情的享受生活；更为明确的人生目标。这些都是GTD的思想，也是我们正在做并且努力做的产品的思想。&lt;br /&gt;
&lt;strong&gt;如果你对GTD思想认同并且有兴趣和我们一起去做好产品的话，那么，来吧！&lt;/strong&gt;&lt;br /&gt;
&lt;span id=&quot;more-2115&quot;&gt;&lt;/span&gt;&lt;/p&gt;
&lt;h2 class=&quot;part-title&quot;&gt;俺们公司&lt;/h2&gt;
&lt;ul&gt;
&lt;li&gt;坐落在杭州，传说中的最适宜居住城市。&lt;/li&gt;
&lt;li&gt;另外一家水果公司的产品爱好者，apple&lt;/li&gt;
&lt;li&gt;车库创业型团队，但有明亮的落地窗，沙发床，免费的咖啡以及茶叶&amp;#8230;&lt;/li&gt;
&lt;li&gt;注重自身修养的提升，所以我们会有很多书&lt;/li&gt;
&lt;li&gt;团队思想的碰撞，争执到面红耳赤，但是只对事不对人，我们坚信，思想碰撞之花最美丽&lt;/li&gt;
&lt;li&gt;我们现在做的是一件非常有意义的事情，我们认为这会改变整个人类的工作和生活方式，所以这是值得付出的事业。最好的一点是我们的投资商很支持我们，所以我们只要用最大的努力来做好产品，不需要去处理其他的事情。这让我们更关心产品本身。&lt;/li&gt;
&lt;li&gt;公司网址及产品：&lt;a href=&quot;http://www.doit.im&quot; rel=&quot;nofollow&quot;&gt;http://doit.im&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;h2 class=&quot;part-title&quot;&gt;职位：前端开发&lt;/h2&gt;
&lt;ul&gt;
&lt;li&gt;HTML/CSS/JS这些肯定得懂&lt;/li&gt;
&lt;li&gt;认为IE6已完成历史使命，已经走进历史中去&lt;/li&gt;
&lt;li&gt;会至少一门后端语言更好，诸如ruby&lt;/li&gt;
&lt;li&gt;遵循W3C标准，对语义化有较深认识，手写代码是必须的&lt;/li&gt;
&lt;li&gt;关注业内动态，比如对CSS3以及HTML5的认识，关注行业周边动态，因为我们想要的人并不只是一个页面仔代码仔&lt;/li&gt;
&lt;li&gt;如果有自己的blog请在发送简历的时候务必加上&lt;/li&gt;
&lt;li&gt;有个人作品的也请附上可访问到的地址，这些都是加分的亮点&lt;/li&gt;
&lt;li&gt;没了&amp;#8230;&lt;/li&gt;
&lt;/ul&gt;
&lt;h2 class=&quot;part-title&quot;&gt;其他岗位&lt;/h2&gt;
&lt;p&gt;我们同时也招iPhone, Android, C#, .NET人才，UI设计师，WEB设计师，这方面的也可以给我们投简历。&lt;/p&gt;
&lt;p&gt;简历请投递到leeiio (at) snoworange.com。&lt;/p&gt;

&lt;p&gt;本文地址:&lt;a href=&quot;http://leeiio.me/doit-im-jobs/&quot;&gt;http://leeiio.me/doit-im-jobs/&lt;a&gt;&lt;/p&gt;截至您的阅读器抓取时已有评论&lt;strong&gt; 48 &lt;/strong&gt;条,大家讨论的如此激烈,你为什么不过去瞧瞧?!&lt;hr /&gt;©Copyright 2007-2009 Leeiio Chaos Made &lt;a href=&quot;http://leeiio.me&quot; target=&quot;_blank&quot;&gt;http://Leeiio.me&lt;/a&gt;&lt;br /&gt;&lt;font style=&quot;font-size:15px;font-weight:bold&quot;&gt;本站更換RSS地址：&lt;a href=&quot;http://feed.leeiio.me&quot; title=&quot;戳我訂閱最新rss地址&quot;&gt;&lt;font color=&quot;red&quot;&gt;http://feed.leeiio.me&lt;/font&gt;&lt;/a&gt;，麻煩大家更新下，謝謝！&lt;/font&gt;&lt;br /&gt;
&lt;p&gt;&lt;strong&gt;声明:&lt;/strong&gt; 本站遵循 &lt;a href=&quot;http://creativecommons.org/licenses/by-nc-sa/3.0/&quot;&gt;署名-非商业性使用-相同方式共享 3.0&lt;/a&gt; 共享协议. 转载请注明转自 &lt;a href=&quot;http://leeiio.me&quot;&gt;Leeiio.me&lt;/a&gt;
&lt;img src=&quot;http://img.tongji.linezing.com/990626/tongji.gif&quot;/&gt;&lt;/p&gt; &lt;ul class=&quot;related_post&quot;&gt;&lt;li&gt;年度曖昧文章&lt;/li&gt;&lt;/ul&gt;&lt;img src=&quot;http://www1.feedsky.com/t1/406711530/1studio/feedsky/s.gif?r=http://leeiio.me/doit-im-jobs/&quot; border=&quot;0&quot; height=&quot;0&quot; width=&quot;0&quot; style=&quot;position:absolute&quot; /&gt;</content:encoded><wfw:commentRss>http://leeiio.me/doit-im-jobs/feed/</wfw:commentRss><slash:comments>48</slash:comments><description>&lt;p class=&quot;fswww1&quot;&gt;&lt;a href=&quot;http://www1.feedsky.com/r/l/feedsky/1studio/406711530/art01.html&quot; target=&quot;_blank&quot;&gt;&lt;img border=&quot;0&quot; ismap=&quot;ismap&quot; src=&quot;http://www1.feedsky.com/r/i/feedsky/1studio/406711530/art01.gif&quot; onerror=&quot;this.style.display='none'&quot; /&gt;&lt;/a&gt;&lt;/p&gt;同样作为一家水果公司SnowOrange(杭州雪橙网络科技有限公司)，我表示鸭梨很大，如何在同类水果中脱颖而出是我们正在奋斗的事业。 提供专业的任务及时间管理服务是我们的事业，目的就是让大家更合理安排时间，提升工作效率；更加宏观的看待工作，让您尽情的享受生活；更为明确的人生目标。这些都是GTD的思想，也是我们正在做并且努力做的产品的思想。 如果你对GTD思想认同并且有兴趣和我们一起去做好产品的话，那么，来吧！ 俺们公司 坐落在杭州，传说中的最适宜居住城市。 另外一家水果公司的产品爱好者，apple 车库创业型团队，但有明亮的落地窗，沙发床，免费的咖啡以及茶叶&amp;#8230; 注重自身修养的提升，所以我们会有很多书 团队思想的碰撞，争执到面红耳赤，但是只对事不对人，我们坚信，思想碰撞之花最美丽 我们现在做的是一件非常有意义的事情，我们认为这会改变整个人类的工作和生活方式，所以这是值得付出的事业。最好的一点是我们的投资商很支持我们，所以我们只要用最大的努力来做好产品，不需要去处理其他的事情。这让我们更关心产品本身。 公司网址及产品：http://doit.im 职位：前端开发 HTML/CSS/JS这些肯定得懂 认为IE6已完成历史使命，已经走进历史中去 会至少一门后端语言更好，诸如ruby 遵循W3C标准，对语义化有较深认识，手写代码是必须的 关注业内动态，比如对CSS3以及HTML5的认识，关注行业周边动态，因为我们想要的人并不只是一个页面仔代码仔 如果有自己的blog请在发送简历的时候务必加上 有个人作品的也请附上可访问到的地址，这些都是加分的亮点 没了&amp;#8230; 其他岗位 我们同时也招iPhone, Android, C#, .NET人才，UI设计师，WEB设计师，这方面的也可以给我们投简历。 简历请投递到leeiio (at) snoworange.com。 本文地址:http://leeiio.me/doit-im-jobs/截至您的阅读器抓取时已有评论 48 条,大家讨论的如此激烈,你为什么不过去瞧瞧?!©Copyright 2007-2009 Leeiio Chaos Made http://Leeiio.me本站更換RSS地址：http://feed.leeiio.me，麻煩大家更新下，謝謝！ 声明: 本站遵循 署名-非商业性使用-相同方式共享 3.0 共享协议. 转载请注明转自 Leeiio.me 年度曖昧文章&lt;img src=&quot;http://www1.feedsky.com/t1/406711530/1studio/feedsky/s.gif?r=http://leeiio.me/doit-im-jobs/&quot; border=&quot;0&quot; height=&quot;0&quot; width=&quot;0&quot; style=&quot;position:absolute&quot; /&gt;</description><category>doitim</category><category>招聘</category><category>混合，雜亂無章。</category><pubDate>Wed, 04 Aug 2010 11:01:26 +0800</pubDate><author>Leeiio</author><comments>http://leeiio.me/doit-im-jobs/#comments</comments><guid isPermaLink="false">http://leeiio.me/?p=2115</guid><dc:creator>Leeiio</dc:creator><fs:srclink>http://leeiio.me/doit-im-jobs/</fs:srclink><fs:srcfeed>http://leeiio.me/feed/</fs:srcfeed><fs:itemid>feedsky/1studio/~7316938/406711530/4400837</fs:itemid></item><item><title>溢出文本显示省略号,关于text-overflow:ellipsis的那些事</title><link>http://leeiio.me/text-overflow-ellipsis/</link><content:encoded>&lt;p class=&quot;fswww1&quot;&gt;&lt;a href=&quot;http://www1.feedsky.com/r/l/feedsky/1studio/406711531/art01.html&quot; target=&quot;_blank&quot;&gt;&lt;img border=&quot;0&quot; ismap=&quot;ismap&quot; src=&quot;http://www1.feedsky.com/r/i/feedsky/1studio/406711531/art01.gif&quot; onerror=&quot;this.style.display='none'&quot; /&gt;&lt;/a&gt;&lt;/p&gt;&lt;p&gt;&lt;img src=&quot;http://imgs.leeiio.me/blogimgs/2010/07/20100718-ellipsis.jpg&quot; alt=&quot;溢出文本显示省略号,关于text-overflow:ellipsis的那些事&quot; /&gt;&lt;br /&gt;
这个标题其实已经是一个老生常谈的问题了。很多时候，比如网站最基本的文章列表，标题会很长，而显示列表的区域宽度却没有这么宽，这时候最正常的做法就是让超出宽度的部分文字用省略号(&amp;#8230;)来表示。通常做法是网站后台程序截取一定的字符然后输出到前台显示或者前台用javascript截取一定的字符，但是通过控制字数来截取的话还是存在一个大问题的，因为中文和英文的字符宽度问题，这个字数不好控制，而且通用性较差。那么有没有更好的方法呢，比如直接用CSS来解决的，当然是有的。&lt;br /&gt;
&lt;span id=&quot;more-2055&quot;&gt;&lt;/span&gt;&lt;br /&gt;
text-overflow是一个比较特殊的属性，&lt;a rel=&quot;nofollow&quot; href=&quot;http://www.w3.org/TR/2003/CR-css3-text-20030514/#text-overflow-mode&quot;&gt;W3C早前的文档中&lt;/a&gt;（&lt;a rel=&quot;nofollow&quot; href=&quot;http://www.w3.org/TR/css3-text/&quot;&gt;目前的文档&lt;/a&gt;中没有包含text-overflow属性，FML!）对其的定义是:&lt;/p&gt;
&lt;blockquote&gt;&lt;p&gt;Name:	text-overflow-mode&lt;br /&gt;
Value:	clip | ellipsis | ellipsis-word&lt;/p&gt;&lt;/blockquote&gt;
&lt;p&gt;clip : 　不显示省略标记（&amp;#8230;），而是简单的裁切&lt;br /&gt;
ellipsis : 　当对象内文本溢出时显示省略标记（&amp;#8230;），省略标记插入的位置是最后一个字符。&lt;br /&gt;
ellipsis-word : 　当对象内文本溢出时显示省略标记（&amp;#8230;），省略标记插入的位置是最后一个词（word）。&lt;/p&gt;
&lt;p&gt;至于为什么一开始我说text-overflow是一个比较特殊的样式呢？因为我们可以用它代替我们通常所用的标题截取函数，而且这样做对搜索引擎更加友好，如：标题文件有50个汉字，而我们的列表可能只有300px的宽度。如果用标题截取函数，则标题不是完整的，如果我们用CSS样式text-overflow:ellipsis，输出的标题是完整的，只是受容器大小的局限不显示出来罢了（表现上是超出部分显示省略标记&amp;#8230;）。&lt;/p&gt;
&lt;p&gt;text-overflow: ellipsis属性仅是注解，当文本溢出时是否显示省略标记。并不具备其它的样式属性定义。我们想要实现溢出时产生省略号的效果。还必须定义：强制文本在一行内显示（white-space:nowrap）及溢出内容为隐藏（overflow:hidden）。只有这样才能实现溢出文本显示省略号的效果。&lt;a rel=&quot;nofollow&quot; href=&quot;http://www.52css.com/article.asp?id=602&quot;&gt;Via.&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;那么，如果我们要给p标签定义text-overflow:ellipsis就可以这么写：&lt;/p&gt;

&lt;div class=&quot;wp_syntax&quot;&gt;&lt;div class=&quot;code&quot;&gt;&lt;pre class=&quot;css&quot; style=&quot;font-family:monospace;&quot;&gt;p &lt;span style=&quot;color: #00AA00;&quot;&gt;&amp;#123;&lt;/span&gt;
      &lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;white-space&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;:&lt;/span&gt; &lt;span style=&quot;color: #993333;&quot;&gt;nowrap&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;;&lt;/span&gt;
      &lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;width&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;:&lt;/span&gt; &lt;span style=&quot;color: #933;&quot;&gt;&lt;span style=&quot;color: #cc66cc;&quot;&gt;100&lt;/span&gt;%&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;;&lt;/span&gt;                  &lt;span style=&quot;color: #808080; font-style: italic;&quot;&gt;/* IE6 需要定义宽度 */&lt;/span&gt;
      &lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;overflow&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;:&lt;/span&gt; &lt;span style=&quot;color: #993333;&quot;&gt;hidden&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;;&lt;/span&gt;             
&amp;nbsp;
      -o-text-&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;overflow&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;:&lt;/span&gt; ellipsis&lt;span style=&quot;color: #00AA00;&quot;&gt;;&lt;/span&gt;    &lt;span style=&quot;color: #808080; font-style: italic;&quot;&gt;/* Opera */&lt;/span&gt;
      text-&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;overflow&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;:&lt;/span&gt;    ellipsis&lt;span style=&quot;color: #00AA00;&quot;&gt;;&lt;/span&gt;    &lt;span style=&quot;color: #808080; font-style: italic;&quot;&gt;/* IE, Safari (WebKit) */&lt;/span&gt;
   &lt;span style=&quot;color: #00AA00;&quot;&gt;&amp;#125;&lt;/span&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;&lt;em&gt;使用样式前：&lt;/em&gt;&lt;/p&gt;
&lt;p class=&quot;example&quot;&gt;我是一段测试文字，请分别用IE，Safari，chrome，opera浏览器查看我哦！&lt;/p&gt;
&lt;p&gt;&lt;em&gt;使用样式后：&lt;/em&gt;&lt;/p&gt;
&lt;p class=&quot;example ellipsis-1&quot;&gt;我是一段加长过的测试文字，请分别用IE，Safari，chrome，opera浏览器查看我哦！哈哈哈，看到省略号了么？&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;浏览器兼容状况&lt;/strong&gt;&lt;/p&gt;
&lt;style type=&quot;text/css&quot;&gt;
table.standard-table {
border: 1px solid #BBB;
border-collapse: collapse;
}
table.standard-table td.header, table.standard-table th {
background: #EEE;
border: 1px solid #BBB;
font-weight: bold;
padding: 0px 5px;
text-align: left;
}
table.standard-table td {
border: 1px solid #CCC;
padding: 5px;
text-align: left;
vertical-align: top;
}
.example{background:#ddd;border:2px solid #bbb;width: 600px;display:block}
.ellipsis-1{
      white-space: nowrap;
      overflow: hidden;    
      -o-text-overflow: ellipsis;    /* Opera */
      text-overflow:    ellipsis;    /* IE, Safari (WebKit) */
}
.xul{
-moz-binding: url('../ellipsis.xml#ellipsis');
}
&lt;/style&gt;
&lt;table class=&quot;standard-table&quot;&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;th&gt;Browser&lt;/th&gt;
&lt;th&gt;Lowest Version&lt;/th&gt;
&lt;th&gt;Support of&lt;/th&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Internet Explorer&lt;/td&gt;
&lt;td&gt;&lt;strong&gt;6.0&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;text-overflow&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Firefox (Gecko)&lt;/td&gt;
&lt;td&gt;&amp;#8212;&lt;/td&gt;
&lt;td&gt;&amp;#8212;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Opera&lt;/td&gt;
&lt;td&gt;&lt;strong&gt;9.0&lt;/strong&gt;&lt;/td&gt;
&lt;td&gt;-o-text-overflow&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;Safari (WebKit)&lt;/td&gt;
&lt;td&gt;&lt;strong&gt;1.3&lt;/strong&gt; (312.3)&lt;/td&gt;
&lt;td&gt;text-overflow&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;
&lt;p&gt;&lt;em&gt;OH,FML!Firefox不支持这个属性！&lt;/em&gt;这回，Firefox你也太另类了吧！还有别的办法么，当然有，方法还挺多的。&lt;br /&gt;
比如Mozilla developer center推荐的&lt;a href=&quot;https://developer.mozilla.org/En/CSS/-moz-binding&quot; rel=&quot;nofollow&quot;&gt;-moz-binding&lt;/a&gt; CSS属性。Mozilla developer center给出的理由是text-overflow没有W3C的规范&amp;#8230;但是因为Firefox支持XUL，一种XML的用户界面语言。并且Firefox还支持XBL，一种XML绑定语言，这样我们就可以使用Mozilla developer center推荐的&lt;a href=&quot;https://developer.mozilla.org/En/CSS/-moz-binding&quot; rel=&quot;nofollow&quot;&gt;-moz-binding&lt;/a&gt; CSS属性来绑定XUL里的ellipsis属性了。&lt;/p&gt;
&lt;h4 class=&quot;part-title&quot;&gt;1.XUL方式&lt;/h4&gt;
&lt;p&gt;首先，我们创建XUL，它应该被保存为ellipsis.xml：&lt;/p&gt;

&lt;div class=&quot;wp_syntax&quot;&gt;&lt;div class=&quot;code&quot;&gt;&lt;pre class=&quot;xml&quot; style=&quot;font-family:monospace;&quot;&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;lt;?xml&lt;/span&gt; &lt;span style=&quot;color: #000066;&quot;&gt;version&lt;/span&gt;=&lt;span style=&quot;color: #ff0000;&quot;&gt;&amp;quot;1.0&amp;quot;&lt;/span&gt;&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;?&amp;gt;&lt;/span&gt;&lt;/span&gt;  
&lt;span style=&quot;color: #009900;&quot;&gt;&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;lt;bindings&lt;/span&gt;   &lt;/span&gt;
&lt;span style=&quot;color: #009900;&quot;&gt;  &lt;span style=&quot;color: #000066;&quot;&gt;xmlns&lt;/span&gt;=&lt;span style=&quot;color: #ff0000;&quot;&gt;&amp;quot;http://www.mozilla.org/xbl&amp;quot;&lt;/span&gt;  &lt;/span&gt;
&lt;span style=&quot;color: #009900;&quot;&gt;  &lt;span style=&quot;color: #000066;&quot;&gt;xmlns:xbl&lt;/span&gt;=&lt;span style=&quot;color: #ff0000;&quot;&gt;&amp;quot;http://www.mozilla.org/xbl&amp;quot;&lt;/span&gt;  &lt;/span&gt;
&lt;span style=&quot;color: #009900;&quot;&gt;  &lt;span style=&quot;color: #000066;&quot;&gt;xmlns:xul&lt;/span&gt;=&lt;span style=&quot;color: #ff0000;&quot;&gt;&amp;quot;http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul&amp;quot;&lt;/span&gt;  &lt;/span&gt;
&lt;span style=&quot;color: #009900;&quot;&gt;&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;  
    &lt;span style=&quot;color: #009900;&quot;&gt;&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;lt;binding&lt;/span&gt; &lt;span style=&quot;color: #000066;&quot;&gt;id&lt;/span&gt;=&lt;span style=&quot;color: #ff0000;&quot;&gt;&amp;quot;ellipsis&amp;quot;&lt;/span&gt;&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;  
        &lt;span style=&quot;color: #009900;&quot;&gt;&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;lt;content&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;  
            &lt;span style=&quot;color: #009900;&quot;&gt;&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;lt;xul:window&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;  
                &lt;span style=&quot;color: #009900;&quot;&gt;&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;lt;xul:description&lt;/span&gt; &lt;span style=&quot;color: #000066;&quot;&gt;crop&lt;/span&gt;=&lt;span style=&quot;color: #ff0000;&quot;&gt;&amp;quot;end&amp;quot;&lt;/span&gt; &lt;span style=&quot;color: #000066;&quot;&gt;xbl:inherits&lt;/span&gt;=&lt;span style=&quot;color: #ff0000;&quot;&gt;&amp;quot;value=xbl:text&amp;quot;&lt;/span&gt;&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;gt;&lt;/span&gt;&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;lt;children&lt;/span&gt;&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;/&amp;gt;&lt;/span&gt;&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;lt;/xul:description&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;  
            &lt;span style=&quot;color: #009900;&quot;&gt;&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;lt;/xul:window&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;  
        &lt;span style=&quot;color: #009900;&quot;&gt;&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;lt;/content&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;  
    &lt;span style=&quot;color: #009900;&quot;&gt;&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;lt;/binding&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;  
&lt;span style=&quot;color: #009900;&quot;&gt;&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;lt;/bindings&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;然后我们需要把这个xml文件放到一个目录，原来的css需要加一条，变成这样&lt;/p&gt;

&lt;div class=&quot;wp_syntax&quot;&gt;&lt;div class=&quot;code&quot;&gt;&lt;pre class=&quot;css&quot; style=&quot;font-family:monospace;&quot;&gt;p &lt;span style=&quot;color: #00AA00;&quot;&gt;&amp;#123;&lt;/span&gt;
      &lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;white-space&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;:&lt;/span&gt; &lt;span style=&quot;color: #993333;&quot;&gt;nowrap&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;;&lt;/span&gt;
      &lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;width&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;:&lt;/span&gt; &lt;span style=&quot;color: #933;&quot;&gt;&lt;span style=&quot;color: #cc66cc;&quot;&gt;100&lt;/span&gt;%&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;;&lt;/span&gt;                  &lt;span style=&quot;color: #808080; font-style: italic;&quot;&gt;/* IE6 需要定义宽度 */&lt;/span&gt;
      &lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;overflow&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;:&lt;/span&gt; &lt;span style=&quot;color: #993333;&quot;&gt;hidden&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;;&lt;/span&gt;             
&amp;nbsp;
      -o-text-&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;overflow&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;:&lt;/span&gt; ellipsis&lt;span style=&quot;color: #00AA00;&quot;&gt;;&lt;/span&gt;    &lt;span style=&quot;color: #808080; font-style: italic;&quot;&gt;/* Opera */&lt;/span&gt;
      text-&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;overflow&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;:&lt;/span&gt;    ellipsis&lt;span style=&quot;color: #00AA00;&quot;&gt;;&lt;/span&gt;    &lt;span style=&quot;color: #808080; font-style: italic;&quot;&gt;/* IE, Safari (WebKit) */&lt;/span&gt;
      -moz-binding&lt;span style=&quot;color: #00AA00;&quot;&gt;:&lt;/span&gt; &lt;span style=&quot;color: #993333;&quot;&gt;url&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #ff0000;&quot;&gt;'ellipsis.xml#ellipsis'&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;;&lt;/span&gt;    &lt;span style=&quot;color: #808080; font-style: italic;&quot;&gt;/* Firefox */&lt;/span&gt;
   &lt;span style=&quot;color: #00AA00;&quot;&gt;&amp;#125;&lt;/span&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;虽然Firefox通过XUL的方式实现了ellipsis，但是还是需要注意以下这些问题：&lt;br /&gt;
1.经过XUL处理过的文本你将不能被选中，按理说-moz-user-select: text; 属性将允许文本被选中，但是我没有试验成功。&lt;br /&gt;
2.如果你给父元素绑定了XUL，那么子元素的内容将变得不可见。例如：&lt;/p&gt;
&lt;p class=&quot;example xul ellipsis-1&quot;&gt;It is a long&lt;em&gt;haha&lt;/em&gt; long long long long text!&lt;/p&gt;
&lt;p&gt;如果你只是给p节点绑定了XUL，那么在Firefox下你将看不到&lt;em&gt;haha&lt;/em&gt;这个内容。&lt;br /&gt;
它的源代码实际上是：&lt;/p&gt;

&lt;div class=&quot;wp_syntax&quot;&gt;&lt;div class=&quot;code&quot;&gt;&lt;pre class=&quot;div&quot; style=&quot;font-family:monospace;&quot;&gt;&lt;span style=&quot;color: #44aa44;&quot;&gt;&amp;lt;&lt;/span&gt;p&lt;span style=&quot;color: #44aa44;&quot;&gt;&amp;gt;&lt;/span&gt;It is a long&lt;span style=&quot;color: #44aa44;&quot;&gt;&amp;lt;&lt;/span&gt;em&lt;span style=&quot;color: #44aa44;&quot;&gt;&amp;gt;&lt;/span&gt; haha&lt;span style=&quot;color: #44aa44;&quot;&gt;&amp;lt;/&lt;/span&gt;em&lt;span style=&quot;color: #44aa44;&quot;&gt;&amp;gt;&lt;/span&gt; long long long long text&lt;span style=&quot;color: #44aa44;&quot;&gt;!&amp;lt;/&lt;/span&gt;p&lt;span style=&quot;color: #44aa44;&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;参考资料:&lt;/p&gt;
&lt;p&gt;http://www.w3.org/TR/2003/CR-css3-text-20030514/&lt;/p&gt;
&lt;p&gt;http://www.quirksmode.org/css/contents.html&lt;/p&gt;
&lt;p&gt;https://bugzilla.mozilla.org/show_bug.cgi?id=312156&lt;/p&gt;
&lt;p&gt;https://developer.mozilla.org/En/XUL&lt;/p&gt;
&lt;p&gt;https://developer.mozilla.org/En/XUL/Description&lt;/p&gt;
&lt;p&gt;http://www.rikkertkoppes.com/thoughts/2008/6/&lt;/p&gt;
&lt;p&gt;http://www.w3.org/TR/xbl/&lt;/p&gt;
&lt;p&gt;http://www.w3.org/TR/css3-text/&lt;/p&gt;
&lt;h4 class=&quot;part-title&quot;&gt;2.Javascript方式&lt;/h4&gt;
&lt;p&gt;既然XUL无法完美解决Firefox下文字溢出显示&amp;#8230;，那么我们就求助javascript吧，当然，并不是古老的截取一定数目的字符来实现。&lt;br /&gt;
这里以jQuery为例，代码如下：&lt;/p&gt;

&lt;div class=&quot;wp_syntax&quot;&gt;&lt;div class=&quot;code&quot;&gt;&lt;pre class=&quot;javascript&quot; style=&quot;font-family:monospace;&quot;&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #003366; font-weight: bold;&quot;&gt;function&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;$&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt; &lt;span style=&quot;color: #009900;&quot;&gt;&amp;#123;&lt;/span&gt;
	$.&lt;span style=&quot;color: #660066;&quot;&gt;fn&lt;/span&gt;.&lt;span style=&quot;color: #660066;&quot;&gt;ellipsis&lt;/span&gt; &lt;span style=&quot;color: #339933;&quot;&gt;=&lt;/span&gt; &lt;span style=&quot;color: #003366; font-weight: bold;&quot;&gt;function&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;enableUpdating&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#123;&lt;/span&gt;
		&lt;span style=&quot;color: #003366; font-weight: bold;&quot;&gt;var&lt;/span&gt; s &lt;span style=&quot;color: #339933;&quot;&gt;=&lt;/span&gt; document.&lt;span style=&quot;color: #660066;&quot;&gt;documentElement&lt;/span&gt;.&lt;span style=&quot;color: #660066;&quot;&gt;style&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;;&lt;/span&gt;
		&lt;span style=&quot;color: #000066; font-weight: bold;&quot;&gt;if&lt;/span&gt; &lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;!&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #3366CC;&quot;&gt;'textOverflow'&lt;/span&gt; &lt;span style=&quot;color: #000066; font-weight: bold;&quot;&gt;in&lt;/span&gt; s &lt;span style=&quot;color: #339933;&quot;&gt;||&lt;/span&gt; &lt;span style=&quot;color: #3366CC;&quot;&gt;'OTextOverflow'&lt;/span&gt; &lt;span style=&quot;color: #000066; font-weight: bold;&quot;&gt;in&lt;/span&gt; s&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt; &lt;span style=&quot;color: #009900;&quot;&gt;&amp;#123;&lt;/span&gt;
			&lt;span style=&quot;color: #000066; font-weight: bold;&quot;&gt;return&lt;/span&gt; &lt;span style=&quot;color: #000066; font-weight: bold;&quot;&gt;this&lt;/span&gt;.&lt;span style=&quot;color: #660066;&quot;&gt;each&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #003366; font-weight: bold;&quot;&gt;function&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#123;&lt;/span&gt;
				&lt;span style=&quot;color: #003366; font-weight: bold;&quot;&gt;var&lt;/span&gt; el &lt;span style=&quot;color: #339933;&quot;&gt;=&lt;/span&gt; $&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #000066; font-weight: bold;&quot;&gt;this&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;;&lt;/span&gt;
				&lt;span style=&quot;color: #000066; font-weight: bold;&quot;&gt;if&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;el.&lt;span style=&quot;color: #660066;&quot;&gt;css&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #3366CC;&quot;&gt;&amp;quot;overflow&amp;quot;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt; &lt;span style=&quot;color: #339933;&quot;&gt;==&lt;/span&gt; &lt;span style=&quot;color: #3366CC;&quot;&gt;&amp;quot;hidden&amp;quot;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#123;&lt;/span&gt;
					&lt;span style=&quot;color: #003366; font-weight: bold;&quot;&gt;var&lt;/span&gt; originalText &lt;span style=&quot;color: #339933;&quot;&gt;=&lt;/span&gt; el.&lt;span style=&quot;color: #660066;&quot;&gt;html&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;;&lt;/span&gt;
					&lt;span style=&quot;color: #003366; font-weight: bold;&quot;&gt;var&lt;/span&gt; w &lt;span style=&quot;color: #339933;&quot;&gt;=&lt;/span&gt; el.&lt;span style=&quot;color: #660066;&quot;&gt;width&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;;&lt;/span&gt;
&amp;nbsp;
					&lt;span style=&quot;color: #003366; font-weight: bold;&quot;&gt;var&lt;/span&gt; t &lt;span style=&quot;color: #339933;&quot;&gt;=&lt;/span&gt; $&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #000066; font-weight: bold;&quot;&gt;this&lt;/span&gt;.&lt;span style=&quot;color: #660066;&quot;&gt;cloneNode&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #003366; font-weight: bold;&quot;&gt;true&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;.&lt;span style=&quot;color: #660066;&quot;&gt;hide&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;.&lt;span style=&quot;color: #660066;&quot;&gt;css&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#123;&lt;/span&gt;
                        &lt;span style=&quot;color: #3366CC;&quot;&gt;'position'&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;:&lt;/span&gt; &lt;span style=&quot;color: #3366CC;&quot;&gt;'absolute'&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;,&lt;/span&gt;
                        &lt;span style=&quot;color: #3366CC;&quot;&gt;'width'&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;:&lt;/span&gt; &lt;span style=&quot;color: #3366CC;&quot;&gt;'auto'&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;,&lt;/span&gt;
                        &lt;span style=&quot;color: #3366CC;&quot;&gt;'overflow'&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;:&lt;/span&gt; &lt;span style=&quot;color: #3366CC;&quot;&gt;'visible'&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;,&lt;/span&gt;
                        &lt;span style=&quot;color: #3366CC;&quot;&gt;'max-width'&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;:&lt;/span&gt; &lt;span style=&quot;color: #3366CC;&quot;&gt;'inherit'&lt;/span&gt;
                    &lt;span style=&quot;color: #009900;&quot;&gt;&amp;#125;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;;&lt;/span&gt;
					el.&lt;span style=&quot;color: #660066;&quot;&gt;after&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;t&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;;&lt;/span&gt;
&amp;nbsp;
					&lt;span style=&quot;color: #003366; font-weight: bold;&quot;&gt;var&lt;/span&gt; text &lt;span style=&quot;color: #339933;&quot;&gt;=&lt;/span&gt; originalText&lt;span style=&quot;color: #339933;&quot;&gt;;&lt;/span&gt;
					&lt;span style=&quot;color: #000066; font-weight: bold;&quot;&gt;while&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;text.&lt;span style=&quot;color: #660066;&quot;&gt;length&lt;/span&gt; &lt;span style=&quot;color: #339933;&quot;&gt;&amp;gt;&lt;/span&gt; &lt;span style=&quot;color: #CC0000;&quot;&gt;0&lt;/span&gt; &lt;span style=&quot;color: #339933;&quot;&gt;&amp;amp;&amp;amp;&lt;/span&gt; t.&lt;span style=&quot;color: #660066;&quot;&gt;width&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt; &lt;span style=&quot;color: #339933;&quot;&gt;&amp;gt;&lt;/span&gt; el.&lt;span style=&quot;color: #660066;&quot;&gt;width&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#123;&lt;/span&gt;
						text &lt;span style=&quot;color: #339933;&quot;&gt;=&lt;/span&gt; text.&lt;span style=&quot;color: #660066;&quot;&gt;substr&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #CC0000;&quot;&gt;0&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;,&lt;/span&gt; text.&lt;span style=&quot;color: #660066;&quot;&gt;length&lt;/span&gt; &lt;span style=&quot;color: #339933;&quot;&gt;-&lt;/span&gt; &lt;span style=&quot;color: #CC0000;&quot;&gt;1&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;;&lt;/span&gt;
						t.&lt;span style=&quot;color: #660066;&quot;&gt;html&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;text &lt;span style=&quot;color: #339933;&quot;&gt;+&lt;/span&gt; &lt;span style=&quot;color: #3366CC;&quot;&gt;&amp;quot;...&amp;quot;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;;&lt;/span&gt;
					&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#125;&lt;/span&gt;
					el.&lt;span style=&quot;color: #660066;&quot;&gt;html&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;t.&lt;span style=&quot;color: #660066;&quot;&gt;html&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;;&lt;/span&gt;
&amp;nbsp;
					t.&lt;span style=&quot;color: #660066;&quot;&gt;remove&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;;&lt;/span&gt;
&amp;nbsp;
					&lt;span style=&quot;color: #000066; font-weight: bold;&quot;&gt;if&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;enableUpdating &lt;span style=&quot;color: #339933;&quot;&gt;==&lt;/span&gt; &lt;span style=&quot;color: #003366; font-weight: bold;&quot;&gt;true&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#123;&lt;/span&gt;
						&lt;span style=&quot;color: #003366; font-weight: bold;&quot;&gt;var&lt;/span&gt; oldW &lt;span style=&quot;color: #339933;&quot;&gt;=&lt;/span&gt; el.&lt;span style=&quot;color: #660066;&quot;&gt;width&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;;&lt;/span&gt;
						setInterval&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #003366; font-weight: bold;&quot;&gt;function&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#123;&lt;/span&gt;
							&lt;span style=&quot;color: #000066; font-weight: bold;&quot;&gt;if&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;el.&lt;span style=&quot;color: #660066;&quot;&gt;width&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt; &lt;span style=&quot;color: #339933;&quot;&gt;!=&lt;/span&gt; oldW&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#123;&lt;/span&gt;
								oldW &lt;span style=&quot;color: #339933;&quot;&gt;=&lt;/span&gt; el.&lt;span style=&quot;color: #660066;&quot;&gt;width&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;;&lt;/span&gt;
								el.&lt;span style=&quot;color: #660066;&quot;&gt;html&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;originalText&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;;&lt;/span&gt;
								el.&lt;span style=&quot;color: #660066;&quot;&gt;ellipsis&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;;&lt;/span&gt;
							&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#125;&lt;/span&gt;
						&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#125;&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;,&lt;/span&gt; &lt;span style=&quot;color: #CC0000;&quot;&gt;200&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;;&lt;/span&gt;
					&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#125;&lt;/span&gt;
				&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#125;&lt;/span&gt;
			&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#125;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;;&lt;/span&gt;
		&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#125;&lt;/span&gt; &lt;span style=&quot;color: #000066; font-weight: bold;&quot;&gt;else&lt;/span&gt; &lt;span style=&quot;color: #000066; font-weight: bold;&quot;&gt;return&lt;/span&gt; &lt;span style=&quot;color: #000066; font-weight: bold;&quot;&gt;this&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;;&lt;/span&gt;
	&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#125;&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;;&lt;/span&gt;
&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#125;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#40;&lt;/span&gt;jQuery&lt;span style=&quot;color: #009900;&quot;&gt;&amp;#41;&lt;/span&gt;&lt;span style=&quot;color: #339933;&quot;&gt;;&lt;/span&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;这段js的原理很简单，就是通过不断的比较宽度值，然后逐个缩短字符宽度，当最后宽度合适的时候，停止循环，就实现了文字溢出显示&amp;#8230;的效果。&lt;br /&gt;
这段js还需要一段css来配合。&lt;/p&gt;

&lt;div class=&quot;wp_syntax&quot;&gt;&lt;div class=&quot;code&quot;&gt;&lt;pre class=&quot;css&quot; style=&quot;font-family:monospace;&quot;&gt;&lt;span style=&quot;color: #6666ff;&quot;&gt;.overflow&lt;/span&gt; &lt;span style=&quot;color: #00AA00;&quot;&gt;&amp;#123;&lt;/span&gt;
	text-&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;overflow&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;:&lt;/span&gt; ellipsis&lt;span style=&quot;color: #00AA00;&quot;&gt;;&lt;/span&gt;
	-o-text-&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;overflow&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;:&lt;/span&gt; ellipsis&lt;span style=&quot;color: #00AA00;&quot;&gt;;&lt;/span&gt;
	&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;white-space&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;:&lt;/span&gt; &lt;span style=&quot;color: #993333;&quot;&gt;nowrap&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;;&lt;/span&gt;
	&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;overflow&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;:&lt;/span&gt; &lt;span style=&quot;color: #993333;&quot;&gt;hidden&lt;/span&gt;&lt;span style=&quot;color: #00AA00;&quot;&gt;;&lt;/span&gt;
&lt;span style=&quot;color: #00AA00;&quot;&gt;&amp;#125;&lt;/span&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;js里有个判断就是当样式里出现text-overflow或者-o-text-overflow的时候，便不会执行这段js。因为支持这两个属性的浏览器可以自己实现ellipsis效果。&lt;/p&gt;
&lt;p&gt;这两种方法都可以实现Firefox下ellipsis的效果，如何取舍使用，具体还得根据你要运用到的项目的具体情况来具体分析，XUL实现的方法的不足之处在以上已经很详尽地列举了，如果你可以避免或者说这些无关你项目的大问题，那么XUL不失一个好方法。&lt;/p&gt;
&lt;p&gt;至于其他的一些方法你可能在网上也有看到，比如用:after伪类来实现等，个人不推荐，所以我这里也不细说了，如果你有更好的方法，也希望能与我分享，谢谢观看！&lt;/p&gt;

&lt;p&gt;本文地址:&lt;a href=&quot;http://leeiio.me/text-overflow-ellipsis/&quot;&gt;http://leeiio.me/text-overflow-ellipsis/&lt;a&gt;&lt;/p&gt;截至您的阅读器抓取时已有评论&lt;strong&gt; 53 &lt;/strong&gt;条,大家讨论的如此激烈,你为什么不过去瞧瞧?!&lt;hr /&gt;©Copyright 2007-2009 Leeiio Chaos Made &lt;a href=&quot;http://leeiio.me&quot; target=&quot;_blank&quot;&gt;http://Leeiio.me&lt;/a&gt;&lt;br /&gt;&lt;font style=&quot;font-size:15px;font-weight:bold&quot;&gt;本站更換RSS地址：&lt;a href=&quot;http://feed.leeiio.me&quot; title=&quot;戳我訂閱最新rss地址&quot;&gt;&lt;font color=&quot;red&quot;&gt;http://feed.leeiio.me&lt;/font&gt;&lt;/a&gt;，麻煩大家更新下，謝謝！&lt;/font&gt;&lt;br /&gt;
&lt;p&gt;&lt;strong&gt;声明:&lt;/strong&gt; 本站遵循 &lt;a href=&quot;http://creativecommons.org/licenses/by-nc-sa/3.0/&quot;&gt;署名-非商业性使用-相同方式共享 3.0&lt;/a&gt; 共享协议. 转载请注明转自 &lt;a href=&quot;http://leeiio.me&quot;&gt;Leeiio.me&lt;/a&gt;
&lt;img src=&quot;http://img.tongji.linezing.com/990626/tongji.gif&quot;/&gt;&lt;/p&gt; &lt;ul class=&quot;related_post&quot;&gt;&lt;li&gt;年度曖昧文章&lt;/li&gt;&lt;/ul&gt;&lt;img src=&quot;http://www1.feedsky.com/t1/406711531/1studio/feedsky/s.gif?r=http://leeiio.me/text-overflow-ellipsis/&quot; border=&quot;0&quot; height=&quot;0&quot; width=&quot;0&quot; style=&quot;position:absolute&quot; /&gt;</content:encoded><wfw:commentRss>http://leeiio.me/text-overflow-ellipsis/feed/</wfw:commentRss><slash:comments>53</slash:comments><description>&lt;p class=&quot;fswww1&quot;&gt;&lt;a href=&quot;http://www1.feedsky.com/r/l/feedsky/1studio/406711531/art01.html&quot; target=&quot;_blank&quot;&gt;&lt;img border=&quot;0&quot; ismap=&quot;ismap&quot; src=&quot;http://www1.feedsky.com/r/i/feedsky/1studio/406711531/art01.gif&quot; onerror=&quot;this.style.display='none'&quot; /&gt;&lt;/a&gt;&lt;/p&gt;这个标题其实已经是一个老生常谈的问题了。很多时候，比如网站最基本的文章列表，标题会很长，而显示列表的区域宽度却没有这么宽，这时候最正常的做法就是让超出宽度的部分文字用省略号(&amp;#8230;)来表示。通常做法是网站后台程序截取一定的字符然后输出到前台显示或者前台用javascript截取一定的字符，但是通过控制字数来截取的话还是存在一个大问题的，因为中文和英文的字符宽度问题，这个字数不好控制，而且通用性较差。那么有没有更好的方法呢，比如直接用CSS来解决的，当然是有的。 text-overflow是一个比较特殊的属性，W3C早前的文档中（目前的文档中没有包含text-overflow属性，FML!）对其的定义是: Name: text-overflow-mode Value: clip &amp;#124; ellipsis &amp;#124; ellipsis-word clip : 　不显示省略标记（&amp;#8230;），而是简单的裁切 ellipsis : 　当对象内文本溢出时显示省略标记（&amp;#8230;），省略标记插入的位置是最后一个字符。 ellipsis-word : 　当对象内文本溢出时显示省略标记（&amp;#8230;），省略标记插入的位置是最后一个词（word）。 至于为什么一开始我说text-overflow是一个比较特殊的样式呢？因为我们可以用它代替我们通常所用的标题截取函数，而且这样做对搜索引擎更加友好，如：标题文件有50个汉字，而我们的列表可能只有300px的宽度。如果用标题截取函数，则标题不是完整的，如果我们用CSS样式text-overflow:ellipsis，输出的标题是完整的，只是受容器大小的局限不显示出来罢了（表现上是超出部分显示省略标记&amp;#8230;）。 text-overflow: ellipsis属性仅是注解，当文本溢出时是否显示省略标记。并不具备其它的样式属性定义。我们想要实现溢出时产生省略号的效果。还必须定义：强制文本在一行内显示（white-space:nowrap）及溢出内容为隐藏（overflow:hidden）。只有这样才能实现溢出文本显示省略号的效果。Via. 那么，如果我们要给p标签定义text-overflow:ellipsis就可以这么写： p &amp;#123; white-space: nowrap; width: 100%; /* IE6 需要定义宽度 */ overflow: hidden; &amp;#160; -o-text-overflow: ellipsis; /* Opera */ text-overflow: ellipsis; /* IE, Safari (WebKit) */ &amp;#125; 使用样式前： 我是一段测试文字，请分别用IE，Safari，chrome，opera浏览器查看我哦！ 使用样式后： 我是一段加长过的测试文字，请分别用IE，Safari，chrome，opera浏览器查看我哦！哈哈哈，看到省略号了么？ 浏览器兼容状况 table.standard-table [...]&lt;img src=&quot;http://www1.feedsky.com/t1/406711531/1studio/feedsky/s.gif?r=http://leeiio.me/text-overflow-ellipsis/&quot; border=&quot;0&quot; height=&quot;0&quot; width=&quot;0&quot; style=&quot;position:absolute&quot; /&gt;</description><category>JS/Ajax/AS/Flex</category><category>(X)HTML/CSS/XML/XSL</category><pubDate>Sun, 18 Jul 2010 14:49:26 +0800</pubDate><author>Leeiio</author><comments>http://leeiio.me/text-overflow-ellipsis/#comments</comments><guid isPermaLink="false">http://leeiio.me/?p=2055</guid><dc:creator>Leeiio</dc:creator><fs:srclink>http://leeiio.me/text-overflow-ellipsis/</fs:srclink><fs:srcfeed>http://leeiio.me/feed/</fs:srcfeed><fs:itemid>feedsky/1studio/~7316938/406711531/4400837</fs:itemid></item><item><title>我的MBP 373初次亮相</title><link>http://leeiio.me/my-mbp-373-zod/</link><content:encoded>&lt;p class=&quot;fswww1&quot;&gt;&lt;a href=&quot;http://www1.feedsky.com/r/l/feedsky/1studio/406711532/art01.html&quot; target=&quot;_blank&quot;&gt;&lt;img border=&quot;0&quot; ismap=&quot;ismap&quot; src=&quot;http://www1.feedsky.com/r/i/feedsky/1studio/406711532/art01.gif&quot; onerror=&quot;this.style.display='none'&quot; /&gt;&lt;/a&gt;&lt;/p&gt;&lt;p&gt;入手MBP 373已经一个月有余了，还木有让爱机正式露面，实在是罪过罪过。最近还是有点小忙，都没有什么心得分享给大家，蜗牛表示很抱歉。&lt;br /&gt;
废话不多说，上片。&lt;br /&gt;
2.66GHz MacBook Pro (MC373CH/A) / 2.66GHz Intel Core i7 / 1680 x 1050 雾面&lt;br /&gt;
&lt;img src=&quot;http://pic.yupoo.com/guaniu/282419792f0b/medium.jpg&quot; alt=&quot;MBP 373雾面i7&quot; /&gt;&lt;br /&gt;
&lt;span id=&quot;more-2037&quot;&gt;&lt;/span&gt;&lt;br /&gt;
&lt;img src=&quot;http://pic.yupoo.com/guaniu/102359792e16/medium.jpg&quot; alt=&quot;MBP 373雾面i7&quot; /&gt;&lt;br /&gt;
一望无垠&amp;#8230;&lt;/p&gt;
&lt;p&gt;&lt;img src=&quot;http://pic.yupoo.com/guaniu/492339792e30/medium.jpg&quot; alt=&quot;MBP 373雾面i7&quot; /&gt;&lt;br /&gt;
杯具的“R”“T”两键，虽已至此，但我仍耿耿于怀&amp;#8230;&lt;/p&gt;
&lt;p&gt;&lt;img src=&quot;http://pic.yupoo.com/guaniu/282419792f0b/medium.jpg&quot; alt=&quot;MBP 373雾面i7&quot; /&gt;&lt;br /&gt;
其实她是竖着的，愚蠢的yupoo&amp;#8230;&lt;/p&gt;
&lt;p&gt;&lt;img src=&quot;http://farm5.static.flickr.com/4054/4698385293_e1f5cb11f2.jpg&quot; alt=&quot;MBP 373雾面i7&quot; /&gt;&lt;br /&gt;
她和我的黑苹果&lt;/p&gt;
&lt;p&gt;我的这些色调都不是很明亮，如果想要看更多的雾面屏的MBP,可以戳&lt;a rel=&quot;external nofollow&quot; href=&quot;http://www2.uwants.com/viewthread.php?tid=9779234&quot;&gt;这里&lt;/a&gt;查看，没准要番羽墙。&lt;/p&gt;

&lt;p&gt;本文地址:&lt;a href=&quot;http://leeiio.me/my-mbp-373-zod/&quot;&gt;http://leeiio.me/my-mbp-373-zod/&lt;a&gt;&lt;/p&gt;截至您的阅读器抓取时已有评论&lt;strong&gt; 47 &lt;/strong&gt;条,大家讨论的如此激烈,你为什么不过去瞧瞧?!&lt;hr /&gt;©Copyright 2007-2009 Leeiio Chaos Made &lt;a href=&quot;http://leeiio.me&quot; target=&quot;_blank&quot;&gt;http://Leeiio.me&lt;/a&gt;&lt;br /&gt;&lt;font style=&quot;font-size:15px;font-weight:bold&quot;&gt;本站更換RSS地址：&lt;a href=&quot;http://feed.leeiio.me&quot; title=&quot;戳我訂閱最新rss地址&quot;&gt;&lt;font color=&quot;red&quot;&gt;http://feed.leeiio.me&lt;/font&gt;&lt;/a&gt;，麻煩大家更新下，謝謝！&lt;/font&gt;&lt;br /&gt;
&lt;p&gt;&lt;strong&gt;声明:&lt;/strong&gt; 本站遵循 &lt;a href=&quot;http://creativecommons.org/licenses/by-nc-sa/3.0/&quot;&gt;署名-非商业性使用-相同方式共享 3.0&lt;/a&gt; 共享协议. 转载请注明转自 &lt;a href=&quot;http://leeiio.me&quot;&gt;Leeiio.me&lt;/a&gt;
&lt;img src=&quot;http://img.tongji.linezing.com/990626/tongji.gif&quot;/&gt;&lt;/p&gt; &lt;ul class=&quot;related_post&quot;&gt;&lt;li&gt;年度曖昧文章&lt;/li&gt;&lt;/ul&gt;&lt;img src=&quot;http://www1.feedsky.com/t1/406711532/1studio/feedsky/s.gif?r=http://leeiio.me/my-mbp-373-zod/&quot; border=&quot;0&quot; height=&quot;0&quot; width=&quot;0&quot; style=&quot;position:absolute&quot; /&gt;</content:encoded><wfw:commentRss>http://leeiio.me/my-mbp-373-zod/feed/</wfw:commentRss><slash:comments>47</slash:comments><description>&lt;p class=&quot;fswww1&quot;&gt;&lt;a href=&quot;http://www1.feedsky.com/r/l/feedsky/1studio/406711532/art01.html&quot; target=&quot;_blank&quot;&gt;&lt;img border=&quot;0&quot; ismap=&quot;ismap&quot; src=&quot;http://www1.feedsky.com/r/i/feedsky/1studio/406711532/art01.gif&quot; onerror=&quot;this.style.display='none'&quot; /&gt;&lt;/a&gt;&lt;/p&gt;入手MBP 373已经一个月有余了，还木有让爱机正式露面，实在是罪过罪过。最近还是有点小忙，都没有什么心得分享给大家，蜗牛表示很抱歉。 废话不多说，上片。 2.66GHz MacBook Pro (MC373CH/A) / 2.66GHz Intel Core i7 / 1680 x 1050 雾面 一望无垠&amp;#8230; 杯具的“R”“T”两键，虽已至此，但我仍耿耿于怀&amp;#8230; 其实她是竖着的，愚蠢的yupoo&amp;#8230; 她和我的黑苹果 我的这些色调都不是很明亮，如果想要看更多的雾面屏的MBP,可以戳这里查看，没准要番羽墙。 本文地址:http://leeiio.me/my-mbp-373-zod/截至您的阅读器抓取时已有评论 47 条,大家讨论的如此激烈,你为什么不过去瞧瞧?!©Copyright 2007-2009 Leeiio Chaos Made http://Leeiio.me本站更換RSS地址：http://feed.leeiio.me，麻煩大家更新下，謝謝！ 声明: 本站遵循 署名-非商业性使用-相同方式共享 3.0 共享协议. 转载请注明转自 Leeiio.me 年度曖昧文章&lt;img src=&quot;http://www1.feedsky.com/t1/406711532/1studio/feedsky/s.gif?r=http://leeiio.me/my-mbp-373-zod/&quot; border=&quot;0&quot; height=&quot;0&quot; width=&quot;0&quot; style=&quot;position:absolute&quot; /&gt;</description><category>MacBook Pro</category><category>雾面屏</category><category>MBP 373</category><category>混合，雜亂無章。</category><pubDate>Mon, 14 Jun 2010 13:29:34 +0800</pubDate><author>Leeiio</author><comments>http://leeiio.me/my-mbp-373-zod/#comments</comments><guid isPermaLink="false">http://leeiio.me/?p=2037</guid><dc:creator>Leeiio</dc:creator><fs:srclink>http://leeiio.me/my-mbp-373-zod/</fs:srclink><fs:srcfeed>http://leeiio.me/feed/</fs:srcfeed><fs:itemid>feedsky/1studio/~7316938/406711532/4400837</fs:itemid></item><item><title>俺还活着</title><link>http://leeiio.me/i-am-alive-in-may/</link><content:encoded>&lt;p class=&quot;fswww1&quot;&gt;&lt;a href=&quot;http://www1.feedsky.com/r/l/feedsky/1studio/406711533/art01.html&quot; target=&quot;_blank&quot;&gt;&lt;img border=&quot;0&quot; ismap=&quot;ismap&quot; src=&quot;http://www1.feedsky.com/r/i/feedsky/1studio/406711533/art01.gif&quot; onerror=&quot;this.style.display='none'&quot; /&gt;&lt;/a&gt;&lt;/p&gt;&lt;p&gt;&lt;img src=&quot;http://imgs.leeiio.me/blogimgs/2010/05/20100531_endofmay.jpg&quot; alt=&quot;Mr Raindrop&quot; /&gt;&lt;br /&gt;
&lt;embed src=&quot;http://www.8box.com/feed/cccccc_s_705751_/mini.swf&quot; type=&quot;application/x-shockwave-flash&quot; wmode=&quot;transparent&quot; width=&quot;160&quot; height=&quot;32&quot;&gt;&lt;/embed&gt;&lt;br /&gt;
呃，老久老久没更新blog了，期间，发生了挺多事情，当然，除去一些不好的，还是有很多好的事情的。比如，换工作了。比如，入手了一台MBP。&lt;br /&gt;
不好的事情，我只是想说，在这个流氓横飞的年代，光有理是不行的，更要有力，否则，你什么都保护不了。&lt;br /&gt;
至于新公司，也就是&lt;a href=&quot;http://www.doit.im&quot; rel=&quot;nofollow external&quot;&gt;doit.im&lt;/a&gt;的创办公司，我们正在做着为改善人们生活品质的工作，让您玩的时候开心，工作的时候也充满效率。&lt;br /&gt;
最后，我只是想说，俺还活着。&lt;br /&gt;
最最后，推荐下我们的产品&lt;a href=&quot;http://www.doit.im&quot; rel=&quot;nofollow external&quot;&gt;Doit.im&lt;/a&gt;，目前只是一款WEB版的GTD软件，以后会有更多的版本(Win/Mac/iPhone/Android&amp;#8230;)。&lt;br /&gt;
&lt;span id=&quot;more-2029&quot;&gt;&lt;/span&gt;&lt;br /&gt;
&lt;strong&gt;光鲜的未来在蓬头垢面后重新整装待发，直至闪闪发光，致少年壮志不言愁。未来，因为看不见，所以才要更加努力。&lt;/strong&gt;&lt;br /&gt;
这一句才是我想说的。&lt;/p&gt;
&lt;p&gt;LRC:&lt;/p&gt;
&lt;blockquote&gt;&lt;p&gt;Mr.Raindrop,falling away from me now&lt;br /&gt;
Mr.Raindrop,falling away from me now&lt;br /&gt;
Mr.Raindrop,falling away from me now&lt;br /&gt;
Mr.Raindrop,falling away from me now&lt;/p&gt;
&lt;p&gt;Do you know how much you mean to me?&lt;br /&gt;
Why must you leave?&lt;br /&gt;
I&amp;#8217;m just a flower on a tree&lt;br /&gt;
Why must you leave?&lt;/p&gt;
&lt;p&gt;Do you know how much you mean to me?&lt;br /&gt;
Why must you leave?&lt;br /&gt;
I&amp;#8217;m just a flower on a tree&lt;br /&gt;
Why must you leave?&lt;/p&gt;
&lt;p&gt;Mr.Raindrop,falling away from me now&lt;br /&gt;
Mr.Raindrop,falling away from me now&lt;br /&gt;
Mr.Raindrop,falling away from me now&lt;br /&gt;
Mr.Raindrop,falling away from me now&lt;/p&gt;&lt;/blockquote&gt;

&lt;p&gt;本文地址:&lt;a href=&quot;http://leeiio.me/i-am-alive-in-may/&quot;&gt;http://leeiio.me/i-am-alive-in-may/&lt;a&gt;&lt;/p&gt;截至您的阅读器抓取时已有评论&lt;strong&gt; 49 &lt;/strong&gt;条,大家讨论的如此激烈,你为什么不过去瞧瞧?!&lt;hr /&gt;©Copyright 2007-2009 Leeiio Chaos Made &lt;a href=&quot;http://leeiio.me&quot; target=&quot;_blank&quot;&gt;http://Leeiio.me&lt;/a&gt;&lt;br /&gt;&lt;font style=&quot;font-size:15px;font-weight:bold&quot;&gt;本站更換RSS地址：&lt;a href=&quot;http://feed.leeiio.me&quot; title=&quot;戳我訂閱最新rss地址&quot;&gt;&lt;font color=&quot;red&quot;&gt;http://feed.leeiio.me&lt;/font&gt;&lt;/a&gt;，麻煩大家更新下，謝謝！&lt;/font&gt;&lt;br /&gt;
&lt;p&gt;&lt;strong&gt;声明:&lt;/strong&gt; 本站遵循 &lt;a href=&quot;http://creativecommons.org/licenses/by-nc-sa/3.0/&quot;&gt;署名-非商业性使用-相同方式共享 3.0&lt;/a&gt; 共享协议. 转载请注明转自 &lt;a href=&quot;http://leeiio.me&quot;&gt;Leeiio.me&lt;/a&gt;
&lt;img src=&quot;http://img.tongji.linezing.com/990626/tongji.gif&quot;/&gt;&lt;/p&gt; &lt;ul class=&quot;related_post&quot;&gt;&lt;li&gt;年度曖昧文章&lt;/li&gt;&lt;/ul&gt;&lt;img src=&quot;http://www1.feedsky.com/t1/406711533/1studio/feedsky/s.gif?r=http://leeiio.me/i-am-alive-in-may/&quot; border=&quot;0&quot; height=&quot;0&quot; width=&quot;0&quot; style=&quot;position:absolute&quot; /&gt;</content:encoded><wfw:commentRss>http://leeiio.me/i-am-alive-in-may/feed/</wfw:commentRss><slash:comments>49</slash:comments><description>&lt;p class=&quot;fswww1&quot;&gt;&lt;a href=&quot;http://www1.feedsky.com/r/l/feedsky/1studio/406711533/art01.html&quot; target=&quot;_blank&quot;&gt;&lt;img border=&quot;0&quot; ismap=&quot;ismap&quot; src=&quot;http://www1.feedsky.com/r/i/feedsky/1studio/406711533/art01.gif&quot; onerror=&quot;this.style.display='none'&quot; /&gt;&lt;/a&gt;&lt;/p&gt;呃，老久老久没更新blog了，期间，发生了挺多事情，当然，除去一些不好的，还是有很多好的事情的。比如，换工作了。比如，入手了一台MBP。 不好的事情，我只是想说，在这个流氓横飞的年代，光有理是不行的，更要有力，否则，你什么都保护不了。 至于新公司，也就是doit.im的创办公司，我们正在做着为改善人们生活品质的工作，让您玩的时候开心，工作的时候也充满效率。 最后，我只是想说，俺还活着。 最最后，推荐下我们的产品Doit.im，目前只是一款WEB版的GTD软件，以后会有更多的版本(Win/Mac/iPhone/Android&amp;#8230;)。 光鲜的未来在蓬头垢面后重新整装待发，直至闪闪发光，致少年壮志不言愁。未来，因为看不见，所以才要更加努力。 这一句才是我想说的。 LRC: Mr.Raindrop,falling away from me now Mr.Raindrop,falling away from me now Mr.Raindrop,falling away from me now Mr.Raindrop,falling away from me now Do you know how much you mean to me? Why must you leave? I&amp;#8217;m just a flower on a tree Why must you leave? Do you know [...]&lt;img src=&quot;http://www1.feedsky.com/t1/406711533/1studio/feedsky/s.gif?r=http://leeiio.me/i-am-alive-in-may/&quot; border=&quot;0&quot; height=&quot;0&quot; width=&quot;0&quot; style=&quot;position:absolute&quot; /&gt;</description><category>闪闪发光</category><category>未来</category><category>青春</category><category>混合，雜亂無章。</category><pubDate>Mon, 31 May 2010 20:58:59 +0800</pubDate><author>Leeiio</author><comments>http://leeiio.me/i-am-alive-in-may/#comments</comments><guid isPermaLink="false">http://leeiio.me/?p=2029</guid><dc:creator>Leeiio</dc:creator><fs:srclink>http://leeiio.me/i-am-alive-in-may/</fs:srclink><fs:srcfeed>http://leeiio.me/feed/</fs:srcfeed><fs:itemid>feedsky/1studio/~7316938/406711533/4400837</fs:itemid></item><item><title>一个生日杯具</title><link>http://leeiio.me/a-birthday-cup/</link><content:encoded>&lt;p class=&quot;fswww1&quot;&gt;&lt;a href=&quot;http://www1.feedsky.com/r/l/feedsky/1studio/406711534/art01.html&quot; target=&quot;_blank&quot;&gt;&lt;img border=&quot;0&quot; ismap=&quot;ismap&quot; src=&quot;http://www1.feedsky.com/r/i/feedsky/1studio/406711534/art01.gif&quot; onerror=&quot;this.style.display='none'&quot; /&gt;&lt;/a&gt;&lt;/p&gt;&lt;p&gt;&lt;img src=&quot;http://pic.yupoo.com/guaniu/535099240b15/medium.jpg&quot; alt=&quot;一个生日杯具&quot; /&gt;&lt;br /&gt;
今天才发现神奇的通讯工具秋秋上的生日可以指定为农历，可你知道，我并不是一个生日控，过了一个就够了。&lt;br /&gt;
之前公司说要送我的生日杯具今天终于拿到手了，图案是我自行设计的。作为一个前端，于是代码控了一把，印了一堆网页代码上去。&lt;br /&gt;
总体来说效果还挺不错，第一次印杯子图案，颜色有点偏色，CMYK不适用于杯子印刷咩？&lt;br /&gt;
&lt;span id=&quot;more-2012&quot;&gt;&lt;/span&gt;&lt;br /&gt;
&lt;img src=&quot;http://pic.yupoo.com/guaniu/028849240b0d/medium.jpg&quot; alt=&quot;一个生日杯具&quot; /&gt;&lt;/p&gt;
&lt;p&gt;&lt;img src=&quot;http://pic.yupoo.com/guaniu/961659240b22/medium.jpg&quot; alt=&quot;一个生日杯具&quot; /&gt;&lt;/p&gt;
&lt;p&gt;设计稿&lt;br /&gt;
&lt;img src=&quot;http://pic.yupoo.com/guaniu/614599240b51/bln4a3zo.png&quot; alt=&quot;一个生日杯具设计稿&quot; /&gt;&lt;/p&gt;
&lt;p&gt;谢谢观赏！&lt;/p&gt;
&lt;p&gt;PS:杯具的是农历年应该是丁卯年而不是一九八七年&amp;#8230;&lt;/p&gt;

&lt;p&gt;本文地址:&lt;a href=&quot;http://leeiio.me/a-birthday-cup/&quot;&gt;http://leeiio.me/a-birthday-cup/&lt;a&gt;&lt;/p&gt;截至您的阅读器抓取时已有评论&lt;strong&gt; 83 &lt;/strong&gt;条,大家讨论的如此激烈,你为什么不过去瞧瞧?!&lt;hr /&gt;©Copyright 2007-2009 Leeiio Chaos Made &lt;a href=&quot;http://leeiio.me&quot; target=&quot;_blank&quot;&gt;http://Leeiio.me&lt;/a&gt;&lt;br /&gt;&lt;font style=&quot;font-size:15px;font-weight:bold&quot;&gt;本站更換RSS地址：&lt;a href=&quot;http://feed.leeiio.me&quot; title=&quot;戳我訂閱最新rss地址&quot;&gt;&lt;font color=&quot;red&quot;&gt;http://feed.leeiio.me&lt;/font&gt;&lt;/a&gt;，麻煩大家更新下，謝謝！&lt;/font&gt;&lt;br /&gt;
&lt;p&gt;&lt;strong&gt;声明:&lt;/strong&gt; 本站遵循 &lt;a href=&quot;http://creativecommons.org/licenses/by-nc-sa/3.0/&quot;&gt;署名-非商业性使用-相同方式共享 3.0&lt;/a&gt; 共享协议. 转载请注明转自 &lt;a href=&quot;http://leeiio.me&quot;&gt;Leeiio.me&lt;/a&gt;
&lt;img src=&quot;http://img.tongji.linezing.com/990626/tongji.gif&quot;/&gt;&lt;/p&gt; &lt;ul class=&quot;related_post&quot;&gt;&lt;li&gt;年度曖昧文章&lt;/li&gt;&lt;/ul&gt;&lt;img src=&quot;http://www1.feedsky.com/t1/406711534/1studio/feedsky/s.gif?r=http://leeiio.me/a-birthday-cup/&quot; border=&quot;0&quot; height=&quot;0&quot; width=&quot;0&quot; style=&quot;position:absolute&quot; /&gt;</content:encoded><wfw:commentRss>http://leeiio.me/a-birthday-cup/feed/</wfw:commentRss><slash:comments>83</slash:comments><description>&lt;p class=&quot;fswww1&quot;&gt;&lt;a href=&quot;http://www1.feedsky.com/r/l/feedsky/1studio/406711534/art01.html&quot; target=&quot;_blank&quot;&gt;&lt;img border=&quot;0&quot; ismap=&quot;ismap&quot; src=&quot;http://www1.feedsky.com/r/i/feedsky/1studio/406711534/art01.gif&quot; onerror=&quot;this.style.display='none'&quot; /&gt;&lt;/a&gt;&lt;/p&gt;今天才发现神奇的通讯工具秋秋上的生日可以指定为农历，可你知道，我并不是一个生日控，过了一个就够了。 之前公司说要送我的生日杯具今天终于拿到手了，图案是我自行设计的。作为一个前端，于是代码控了一把，印了一堆网页代码上去。 总体来说效果还挺不错，第一次印杯子图案，颜色有点偏色，CMYK不适用于杯子印刷咩？ 设计稿 谢谢观赏！ PS:杯具的是农历年应该是丁卯年而不是一九八七年&amp;#8230; 本文地址:http://leeiio.me/a-birthday-cup/截至您的阅读器抓取时已有评论 83 条,大家讨论的如此激烈,你为什么不过去瞧瞧?!©Copyright 2007-2009 Leeiio Chaos Made http://Leeiio.me本站更換RSS地址：http://feed.leeiio.me，麻煩大家更新下，謝謝！ 声明: 本站遵循 署名-非商业性使用-相同方式共享 3.0 共享协议. 转载请注明转自 Leeiio.me 年度曖昧文章&lt;img src=&quot;http://www1.feedsky.com/t1/406711534/1studio/feedsky/s.gif?r=http://leeiio.me/a-birthday-cup/&quot; border=&quot;0&quot; height=&quot;0&quot; width=&quot;0&quot; style=&quot;position:absolute&quot; /&gt;</description><category>生日杯具</category><category>混合，雜亂無章。</category><category>平面設計</category><pubDate>Sat, 10 Apr 2010 00:38:43 +0800</pubDate><author>Leeiio</author><comments>http://leeiio.me/a-birthday-cup/#comments</comments><guid isPermaLink="false">http://leeiio.me/?p=2012</guid><dc:creator>Leeiio</dc:creator><fs:srclink>http://leeiio.me/a-birthday-cup/</fs:srclink><fs:srcfeed>http://leeiio.me/feed/</fs:srcfeed><fs:itemid>feedsky/1studio/~7316938/406711534/4400837</fs:itemid></item><item><title>2010 年 CSS 裸奔节 ！</title><link>http://leeiio.me/2010-css-naked-day/</link><content:encoded>&lt;p class=&quot;fswww1&quot;&gt;&lt;a href=&quot;http://www1.feedsky.com/r/l/feedsky/1studio/406711535/art01.html&quot; target=&quot;_blank&quot;&gt;&lt;img border=&quot;0&quot; ismap=&quot;ismap&quot; src=&quot;http://www1.feedsky.com/r/i/feedsky/1studio/406711535/art01.gif&quot; onerror=&quot;this.style.display='none'&quot; /&gt;&lt;/a&gt;&lt;/p&gt;&lt;p&gt;&lt;img src=&quot;http://imgs.leeiio.me/blogimgs/2009/04/20090409_cssnake.jpg&quot; alt=&quot;2010 年 CSS 裸奔节&quot; /&gt;&lt;br /&gt;
由&lt;a href=&quot;http://naked.dustindiaz.com/&quot; rel=&quot;nofollow&quot;&gt;Dustin Diaz&lt;/a&gt;推动的CSS NAKED DAY今年没有按时举行，在其网站上也没有贴出任何的今年的时间，但是推动Web标准发展应该是每位业界人士的一份责任，因此世界各地的人都延续传统，和去年一样是4月9日，大家都纷纷脱去了自己网站的衣服(CSS)，裸奔。&lt;/p&gt;
&lt;p&gt;具体细节大家可以查看我去年的文章&lt;a href=&quot;http://leeiio.me/force-remove-css-in-css-nake-day/&quot;&gt;《拥抱 CSS 裸奔节，用 JavaScript 强制脱衣》&lt;/a&gt;。当然方法有很多，你想怎么裸就怎么裸。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;祝大家裸奔愉快！羞。&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;本文地址:&lt;a href=&quot;http://leeiio.me/2010-css-naked-day/&quot;&gt;http://leeiio.me/2010-css-naked-day/&lt;a&gt;&lt;/p&gt;截至您的阅读器抓取时已有评论&lt;strong&gt; 18 &lt;/strong&gt;条,欢迎您也过来留下您的意见 !&lt;hr /&gt;©Copyright 2007-2009 Leeiio Chaos Made &lt;a href=&quot;http://leeiio.me&quot; target=&quot;_blank&quot;&gt;http://Leeiio.me&lt;/a&gt;&lt;br /&gt;&lt;font style=&quot;font-size:15px;font-weight:bold&quot;&gt;本站更換RSS地址：&lt;a href=&quot;http://feed.leeiio.me&quot; title=&quot;戳我訂閱最新rss地址&quot;&gt;&lt;font color=&quot;red&quot;&gt;http://feed.leeiio.me&lt;/font&gt;&lt;/a&gt;，麻煩大家更新下，謝謝！&lt;/font&gt;&lt;br /&gt;
&lt;p&gt;&lt;strong&gt;声明:&lt;/strong&gt; 本站遵循 &lt;a href=&quot;http://creativecommons.org/licenses/by-nc-sa/3.0/&quot;&gt;署名-非商业性使用-相同方式共享 3.0&lt;/a&gt; 共享协议. 转载请注明转自 &lt;a href=&quot;http://leeiio.me&quot;&gt;Leeiio.me&lt;/a&gt;
&lt;img src=&quot;http://img.tongji.linezing.com/990626/tongji.gif&quot;/&gt;&lt;/p&gt; &lt;ul class=&quot;related_post&quot;&gt;&lt;li&gt;&lt;a href=&quot;http://leeiio.me/force-remove-css-in-css-nake-day/&quot; title=&quot;拥抱 CSS 裸奔节，用 JavaScript 强制脱衣&quot;&gt;拥抱 CSS 裸奔节，用 JavaScript 强制脱衣&lt;/a&gt; (26)&lt;/li&gt;&lt;/ul&gt;&lt;img src=&quot;http://www1.feedsky.com/t1/406711535/1studio/feedsky/s.gif?r=http://leeiio.me/2010-css-naked-day/&quot; border=&quot;0&quot; height=&quot;0&quot; width=&quot;0&quot; style=&quot;position:absolute&quot; /&gt;</content:encoded><wfw:commentRss>http://leeiio.me/2010-css-naked-day/feed/</wfw:commentRss><slash:comments>18</slash:comments><description>&lt;p class=&quot;fswww1&quot;&gt;&lt;a href=&quot;http://www1.feedsky.com/r/l/feedsky/1studio/406711535/art01.html&quot; target=&quot;_blank&quot;&gt;&lt;img border=&quot;0&quot; ismap=&quot;ismap&quot; src=&quot;http://www1.feedsky.com/r/i/feedsky/1studio/406711535/art01.gif&quot; onerror=&quot;this.style.display='none'&quot; /&gt;&lt;/a&gt;&lt;/p&gt;由Dustin Diaz推动的CSS NAKED DAY今年没有按时举行，在其网站上也没有贴出任何的今年的时间，但是推动Web标准发展应该是每位业界人士的一份责任，因此世界各地的人都延续传统，和去年一样是4月9日，大家都纷纷脱去了自己网站的衣服(CSS)，裸奔。 具体细节大家可以查看我去年的文章《拥抱 CSS 裸奔节，用 JavaScript 强制脱衣》。当然方法有很多，你想怎么裸就怎么裸。 祝大家裸奔愉快！羞。 本文地址:http://leeiio.me/2010-css-naked-day/截至您的阅读器抓取时已有评论 18 条,欢迎您也过来留下您的意见 !©Copyright 2007-2009 Leeiio Chaos Made http://Leeiio.me本站更換RSS地址：http://feed.leeiio.me，麻煩大家更新下，謝謝！ 声明: 本站遵循 署名-非商业性使用-相同方式共享 3.0 共享协议. 转载请注明转自 Leeiio.me 拥抱 CSS 裸奔节，用 JavaScript 强制脱衣 (26)&lt;img src=&quot;http://www1.feedsky.com/t1/406711535/1studio/feedsky/s.gif?r=http://leeiio.me/2010-css-naked-day/&quot; border=&quot;0&quot; height=&quot;0&quot; width=&quot;0&quot; style=&quot;position:absolute&quot; /&gt;</description><category>CSS 裸奔节</category><category>CSS Naked Day</category><category>(X)HTML/CSS/XML/XSL</category><pubDate>Fri, 09 Apr 2010 10:06:12 +0800</pubDate><author>Leeiio</author><comments>http://leeiio.me/2010-css-naked-day/#comments</comments><guid isPermaLink="false">http://leeiio.me/?p=2013</guid><dc:creator>Leeiio</dc:creator><fs:srclink>http://leeiio.me/2010-css-naked-day/</fs:srclink><fs:srcfeed>http://leeiio.me/feed/</fs:srcfeed><fs:itemid>feedsky/1studio/~7316938/406711535/4400837</fs:itemid></item><item><title>消失的CSS3 box-shadow 属性?</title><link>http://leeiio.me/css3-box-shadow-removed/</link><content:encoded>&lt;p class=&quot;fswww1&quot;&gt;&lt;a href=&quot;http://www1.feedsky.com/r/l/feedsky/1studio/406711536/art01.html&quot; target=&quot;_blank&quot;&gt;&lt;img border=&quot;0&quot; ismap=&quot;ismap&quot; src=&quot;http://www1.feedsky.com/r/i/feedsky/1studio/406711536/art01.gif&quot; onerror=&quot;this.style.display='none'&quot; /&gt;&lt;/a&gt;&lt;/p&gt;&lt;p&gt;如果你在疑惑为什么标题后面是个问号，因为我也不确定具体这个box-shadow属性是否消失后就不再回来了。发生了什么事？其实就是最近在看&lt;a href=&quot;http://www.w3.org/TR/css3-background/#the-box-shadow&quot; rel=&quot;nofollow&quot;&gt;W3C关于css3的20091217文档&lt;/a&gt;的时候发现box-shadow属性已经没有任何说明了，只留下这么一段话：&lt;/p&gt;
&lt;blockquote&gt;&lt;p&gt;
This module previously defined a ‘box-shadow’ property. This feature has been removed from this module for further discussion, and should reappear in another CSS module (or a later version of this module) in the near future.&lt;br /&gt;
以前这个模块定义了一个‘box-shadow’属性。这个特性目前已从这个模块中移除以做进一步的讨论，并将会出现在别的 CSS 模块中(或者更高版本的此模块)在不久的将来。
&lt;/p&gt;&lt;/blockquote&gt;
&lt;p&gt;你知道，在css3中box-shadow是一个非常好玩的属性，被用得最广泛的地方莫过于:focus后的input或者textarea，诸如本站的input和留言区域的textarea，你会发现在:focus的状态时是加了box-shadow属性的。如图：&lt;br /&gt;
&lt;em&gt;未激活状态的textarea&lt;/em&gt;&lt;br /&gt;
&lt;img src=&quot;http://imgs.leeiio.me/blogimgs/2010/04/20100404_box-shadow1.png&quot; alt=&quot;消失的CSS3 box-shadow 属性&quot; /&gt;&lt;br /&gt;
&lt;em&gt;激活状态的textarea&lt;/em&gt;&lt;br /&gt;
&lt;img src=&quot;http://imgs.leeiio.me/blogimgs/2010/04/20100404_box-shadow2.png&quot; alt=&quot;消失的CSS3 box-shadow 属性&quot; /&gt;&lt;br /&gt;
&lt;span id=&quot;more-1987&quot;&gt;&lt;/span&gt;&lt;br /&gt;
当然在没看W3C的文档之前，我在别人的blog里看到的对于box-shadow的介绍发现内容都十分的陈旧了，大部分的对于shadow的定义都只是inset || [ &amp;lt;length&gt; &amp;lt;length&gt; &amp;lt;length&gt;?  || &amp;lt;color&gt; ]而实际上其实是inset || [ &amp;lt;length&gt; &amp;lt;length&gt; &amp;lt;length&gt;? &amp;lt;length&gt;? || &amp;lt;color&gt; ]。也就是有四个length可以定义。&lt;/p&gt;
&lt;p&gt;在box-shadow没被移除前的最近一个CSS3草案文档(&lt;a href=&quot;http://www.w3.org/TR/2008/WD-css3-background-20080910/#the-box-shadow&quot; rel=&quot;nofollow&quot;&gt;http://www.w3.org/TR/2008/WD-css3-background-20080910/#the-box-shadow&lt;/a&gt;)中是这样定义的：&lt;/p&gt;
&lt;p&gt;&lt;code&gt;none | &amp;lt;shadow&gt; [ &amp;lt;shadow&gt; ]*&lt;/code&gt;&lt;/p&gt;
&lt;p&gt;这里&lt;shadow&gt;被定义为：&lt;/p&gt;
&lt;p&gt;&lt;code&gt;&amp;lt;shadow&gt; = inset? &amp;#038;&amp;#038; [ &amp;lt;length&gt;{2,4} &amp;#038;&amp;#038; &amp;lt;color&gt;? ]&lt;/code&gt;&lt;/p&gt;
&lt;p&gt;前面两个length长度取值对应着阴影在水平和竖直方向的位移。第三个length长度取值是模糊半径。第四个length长度取值是传播半径，使用正数表示阴影扩大，使用负数表示影子缩小，而这个长度是相对于父元素的大小而言的。&lt;br /&gt;
而inset就是把原本投射在box外部的阴影投射到box里面而实现的内阴影，用过一些作图软件的对于内阴影应该不陌生吧。&lt;/p&gt;
&lt;p&gt;box-shadow属性在不支持的浏览器上会优雅的降级。例如，在微软IE8以下浏览器上看起来都是平淡无奇的盒子而没有任何阴影效果。&lt;/p&gt;
&lt;p&gt;当然前文介绍的&lt;a href=&quot;http://leeiio.me/css3-generator-tools/&quot;&gt;《两个 CSS3样式可视化生成工具：CSS3 Please &amp;#038; CSS3 Generator》&lt;/a&gt;可以帮你更直观的理解box-shadow这个属性。&lt;/p&gt;
&lt;p&gt;如果你希望更多的了解这个目前已经被W3C移除的属性，可以继续阅读以下列表的文章：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href=&quot;http://fredericiana.com/2009/06/12/shadow-boxing-with-moz-box-shadow/&quot; rel=&quot;nofollow&quot;&gt;http://fredericiana.com/2009/06/12/shadow-boxing-with-moz-box-shadow/&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://developer.mozilla.org/en/CSS/-moz-box-shadow&quot; rel=&quot;nofollow&quot;&gt;https://developer.mozilla.org/en/CSS/-moz-box-shadow&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;http://www.w3.org/TR/2008/WD-css3-background-20080910/#the-box-shadow&quot; rel=&quot;nofollow&quot;&gt;http://www.w3.org/TR/2008/WD-css3-background-20080910/#the-box-shadow&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;不知道何时，W3C才会发布正式版的CSS3啊&amp;#8230;&lt;/p&gt;
&lt;p class=&quot;preview left&quot;&gt;&lt;a href=&quot;http://leeiio.me/demo/6-box-shadow-inset/&quot; title=&quot;查看演示&quot;&gt;View Demo
&lt;em title=&quot;CSS3 box-shadow 属性演示&quot;&gt;CSS3 box-shadow Demo&lt;/em&gt;&lt;/a&gt;&lt;/p&gt;&lt;br /&gt;
&lt;p class=&quot;clear&quot;&gt;&lt;/p&gt;

&lt;p&gt;本文地址:&lt;a href=&quot;http://leeiio.me/css3-box-shadow-removed/&quot;&gt;http://leeiio.me/css3-box-shadow-removed/&lt;a&gt;&lt;/p&gt;截至您的阅读器抓取时已有评论&lt;strong&gt; 12 &lt;/strong&gt;条,欢迎您也过来留下您的意见 !&lt;hr /&gt;©Copyright 2007-2009 Leeiio Chaos Made &lt;a href=&quot;http://leeiio.me&quot; target=&quot;_blank&quot;&gt;http://Leeiio.me&lt;/a&gt;&lt;br /&gt;&lt;font style=&quot;font-size:15px;font-weight:bold&quot;&gt;本站更換RSS地址：&lt;a href=&quot;http://feed.leeiio.me&quot; title=&quot;戳我訂閱最新rss地址&quot;&gt;&lt;font color=&quot;red&quot;&gt;http://feed.leeiio.me&lt;/font&gt;&lt;/a&gt;，麻煩大家更新下，謝謝！&lt;/font&gt;&lt;br /&gt;
&lt;p&gt;&lt;strong&gt;声明:&lt;/strong&gt; 本站遵循 &lt;a href=&quot;http://creativecommons.org/licenses/by-nc-sa/3.0/&quot;&gt;署名-非商业性使用-相同方式共享 3.0&lt;/a&gt; 共享协议. 转载请注明转自 &lt;a href=&quot;http://leeiio.me&quot;&gt;Leeiio.me&lt;/a&gt;
&lt;img src=&quot;http://img.tongji.linezing.com/990626/tongji.gif&quot;/&gt;&lt;/p&gt; &lt;ul class=&quot;related_post&quot;&gt;&lt;li&gt;&lt;a href=&quot;http://leeiio.me/css3-generator-tools/&quot; title=&quot;两个CSS3样式可视化生成工具：CSS3 Please &amp;#038; CSS3 Generator&quot;&gt;两个CSS3样式可视化生成工具：CSS3 Please &amp;#038; CSS3 Generator&lt;/a&gt; (12)&lt;/li&gt;&lt;li&gt;&lt;a href=&quot;http://leeiio.me/css-hack-for-firefox-opera-safari-ie/&quot; title=&quot;浏览器专属 CSS Hack:区分 Firefox / Opera / Safari / Internet Explorer&quot;&gt;浏览器专属 CSS Hack:区分 Firefox / Opera / Safari / Internet Explorer&lt;/a&gt; (28)&lt;/li&gt;&lt;li&gt;&lt;a href=&quot;http://leeiio.me/css-modify-selection-color-css3/&quot; title=&quot;CSS 改变选取文字的颜色(CSS3 &amp;#8211; 目前 Firefox/Safari only)&quot;&gt;CSS 改变选取文字的颜色(CSS3 &amp;#8211; 目前 Firefox/Safari only)&lt;/a&gt; (14)&lt;/li&gt;&lt;/ul&gt;&lt;img src=&quot;http://www1.feedsky.com/t1/406711536/1studio/feedsky/s.gif?r=http://leeiio.me/css3-box-shadow-removed/&quot; border=&quot;0&quot; height=&quot;0&quot; width=&quot;0&quot; style=&quot;position:absolute&quot; /&gt;</content:encoded><wfw:commentRss>http://leeiio.me/css3-box-shadow-removed/feed/</wfw:commentRss><slash:comments>12</slash:comments><description>&lt;p class=&quot;fswww1&quot;&gt;&lt;a href=&quot;http://www1.feedsky.com/r/l/feedsky/1studio/406711536/art01.html&quot; target=&quot;_blank&quot;&gt;&lt;img border=&quot;0&quot; ismap=&quot;ismap&quot; src=&quot;http://www1.feedsky.com/r/i/feedsky/1studio/406711536/art01.gif&quot; onerror=&quot;this.style.display='none'&quot; /&gt;&lt;/a&gt;&lt;/p&gt;如果你在疑惑为什么标题后面是个问号，因为我也不确定具体这个box-shadow属性是否消失后就不再回来了。发生了什么事？其实就是最近在看W3C关于css3的20091217文档的时候发现box-shadow属性已经没有任何说明了，只留下这么一段话： This module previously defined a ‘box-shadow’ property. This feature has been removed from this module for further discussion, and should reappear in another CSS module (or a later version of this module) in the near future. 以前这个模块定义了一个‘box-shadow’属性。这个特性目前已从这个模块中移除以做进一步的讨论，并将会出现在别的 CSS 模块中(或者更高版本的此模块)在不久的将来。 你知道，在css3中box-shadow是一个非常好玩的属性，被用得最广泛的地方莫过于:focus后的input或者textarea，诸如本站的input和留言区域的textarea，你会发现在:focus的状态时是加了box-shadow属性的。如图： 未激活状态的textarea 激活状态的textarea 当然在没看W3C的文档之前，我在别人的blog里看到的对于box-shadow的介绍发现内容都十分的陈旧了，大部分的对于shadow的定义都只是inset &amp;#124;&amp;#124; [ &amp;#60;length&gt; &amp;#60;length&gt; &amp;#60;length&gt;? &amp;#124;&amp;#124; &amp;#60;color&gt; ]而实际上其实是inset &amp;#124;&amp;#124; [ &amp;#60;length&gt; [...]&lt;img src=&quot;http://www1.feedsky.com/t1/406711536/1studio/feedsky/s.gif?r=http://leeiio.me/css3-box-shadow-removed/&quot; border=&quot;0&quot; height=&quot;0&quot; width=&quot;0&quot; style=&quot;position:absolute&quot; /&gt;</description><category>box-shadow</category><category>(X)HTML/CSS/XML/XSL</category><category>css3</category><pubDate>Sun, 04 Apr 2010 14:26:17 +0800</pubDate><author>Leeiio</author><comments>http://leeiio.me/css3-box-shadow-removed/#comments</comments><guid isPermaLink="false">http://leeiio.me/?p=1987</guid><dc:creator>Leeiio</dc:creator><fs:srclink>http://leeiio.me/css3-box-shadow-removed/</fs:srclink><fs:srcfeed>http://leeiio.me/feed/</fs:srcfeed><fs:itemid>feedsky/1studio/~7316938/406711536/4400837</fs:itemid></item><item><title>两个CSS3样式可视化生成工具：CSS3 Please &amp; CSS3 Generator</title><link>http://leeiio.me/css3-generator-tools/</link><content:encoded>&lt;p class=&quot;fswww1&quot;&gt;&lt;a href=&quot;http://www1.feedsky.com/r/l/feedsky/1studio/406711537/art01.html&quot; target=&quot;_blank&quot;&gt;&lt;img border=&quot;0&quot; ismap=&quot;ismap&quot; src=&quot;http://www1.feedsky.com/r/i/feedsky/1studio/406711537/art01.gif&quot; onerror=&quot;this.style.display='none'&quot; /&gt;&lt;/a&gt;&lt;/p&gt;&lt;p&gt;CSS3随着浏览器的升级已经被越来越广泛的运用，合理的运用CSS3可以使你的网站更加美观，并且之前只能用js才能实现的效果也已经可以直接用CSS3来实现。但是虽然如此，很多浏览器对CSS3的支持还都是通过其私有属性来达到支持的，鲜有直接对W3C的标准来实现的。诸如firefox的-moz-和webkit的-webkit-属性前缀。&lt;/p&gt;
&lt;p&gt;不过CSS3本身W3C也并未有正式版发布，现在还只是草案。下面我推荐两个很直观的，可视化的，自动生成CSS3样式代码的工具网站给大家。&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;1.CSS3 Generator&lt;/strong&gt;&lt;br /&gt;
&lt;img src=&quot;http://imgs.leeiio.me/blogimgs/2010/04/20100401_css3generator.png&quot; alt=&quot;CSS3 Generator&quot; /&gt;&lt;br /&gt;
选择自己想要的CSS3属性，然后填写数值，右边便可直观的展示出效果了，然后你复制生成的样式代码即可。并且还列出了兼容这些样式的浏览器。可谓十分的方便。&lt;br /&gt;
&lt;a href=&quot;http://www.css3generator.com/&quot; rel=&quot;nofollow&quot;&gt;http://www.css3generator.com/&lt;/a&gt;&lt;br /&gt;
&lt;span id=&quot;more-1972&quot;&gt;&lt;/span&gt;&lt;br /&gt;
&lt;strong&gt;2.CSS3, please! &lt;/strong&gt;&lt;br /&gt;
&lt;img src=&quot;http://imgs.leeiio.me/blogimgs/2010/04/20100401_css3please.png&quot; alt=&quot;CSS3, please! &quot; /&gt;&lt;br /&gt;
这个看起来就更加的直观了，就像做填空题一样，在网页上填写相应的数值，右上角的元素就会呈现出相应的样式。如果你不需要组合这么多效果的话，关闭掉某一些样式属性即可。可以点击“{toggle rule on} ”或者“{toggle rule off} ”来开启单项属性或者关闭。&lt;br /&gt;
&lt;a href=&quot;http://css3please.com/&quot; rel=&quot;nofollow&quot;&gt;http://css3please.com/&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;正如前面所说，CSS3目前还是个草案，并且因为浏览器的关系，目前只有非主流浏览器支持，你知道的，所谓的主流浏览器就是占据了半壁多江山的IE系列了。IE系列目前只有IE8支持很少一部分的CSS3，未来的IE9倒是或许值得期待。&lt;/p&gt;
&lt;p&gt;CSS3组合的好用的恰当确实可以使页面显示的很美观，可是如果只是为了CSS3而CSS3，诸如乱用text-shadow只是为了文字阴影而阴影个人觉得使完全没有必要的。&lt;/p&gt;
&lt;p&gt;祝大家CSS3使用愉快。呃。&lt;/p&gt;

&lt;p&gt;本文地址:&lt;a href=&quot;http://leeiio.me/css3-generator-tools/&quot;&gt;http://leeiio.me/css3-generator-tools/&lt;a&gt;&lt;/p&gt;截至您的阅读器抓取时已有评论&lt;strong&gt; 12 &lt;/strong&gt;条,欢迎您也过来留下您的意见 !&lt;hr /&gt;©Copyright 2007-2009 Leeiio Chaos Made &lt;a href=&quot;http://leeiio.me&quot; target=&quot;_blank&quot;&gt;http://Leeiio.me&lt;/a&gt;&lt;br /&gt;&lt;font style=&quot;font-size:15px;font-weight:bold&quot;&gt;本站更換RSS地址：&lt;a href=&quot;http://feed.leeiio.me&quot; title=&quot;戳我訂閱最新rss地址&quot;&gt;&lt;font color=&quot;red&quot;&gt;http://feed.leeiio.me&lt;/font&gt;&lt;/a&gt;，麻煩大家更新下，謝謝！&lt;/font&gt;&lt;br /&gt;
&lt;p&gt;&lt;strong&gt;声明:&lt;/strong&gt; 本站遵循 &lt;a href=&quot;http://creativecommons.org/licenses/by-nc-sa/3.0/&quot;&gt;署名-非商业性使用-相同方式共享 3.0&lt;/a&gt; 共享协议. 转载请注明转自 &lt;a href=&quot;http://leeiio.me&quot;&gt;Leeiio.me&lt;/a&gt;
&lt;img src=&quot;http://img.tongji.linezing.com/990626/tongji.gif&quot;/&gt;&lt;/p&gt; &lt;ul class=&quot;related_post&quot;&gt;&lt;li&gt;&lt;a href=&quot;http://leeiio.me/css3-box-shadow-removed/&quot; title=&quot;消失的CSS3 box-shadow 属性?&quot;&gt;消失的CSS3 box-shadow 属性?&lt;/a&gt; (12)&lt;/li&gt;&lt;li&gt;&lt;a href=&quot;http://leeiio.me/css-hack-for-firefox-opera-safari-ie/&quot; title=&quot;浏览器专属 CSS Hack:区分 Firefox / Opera / Safari / Internet Explorer&quot;&gt;浏览器专属 CSS Hack:区分 Firefox / Opera / Safari / Internet Explorer&lt;/a&gt; (28)&lt;/li&gt;&lt;li&gt;&lt;a href=&quot;http://leeiio.me/css-modify-selection-color-css3/&quot; title=&quot;CSS 改变选取文字的颜色(CSS3 &amp;#8211; 目前 Firefox/Safari only)&quot;&gt;CSS 改变选取文字的颜色(CSS3 &amp;#8211; 目前 Firefox/Safari only)&lt;/a&gt; (14)&lt;/li&gt;&lt;/ul&gt;&lt;img src=&quot;http://www1.feedsky.com/t1/406711537/1studio/feedsky/s.gif?r=http://leeiio.me/css3-generator-tools/&quot; border=&quot;0&quot; height=&quot;0&quot; width=&quot;0&quot; style=&quot;position:absolute&quot; /&gt;</content:encoded><wfw:commentRss>http://leeiio.me/css3-generator-tools/feed/</wfw:commentRss><slash:comments>12</slash:comments><description>&lt;p class=&quot;fswww1&quot;&gt;&lt;a href=&quot;http://www1.feedsky.com/r/l/feedsky/1studio/406711537/art01.html&quot; target=&quot;_blank&quot;&gt;&lt;img border=&quot;0&quot; ismap=&quot;ismap&quot; src=&quot;http://www1.feedsky.com/r/i/feedsky/1studio/406711537/art01.gif&quot; onerror=&quot;this.style.display='none'&quot; /&gt;&lt;/a&gt;&lt;/p&gt;CSS3随着浏览器的升级已经被越来越广泛的运用，合理的运用CSS3可以使你的网站更加美观，并且之前只能用js才能实现的效果也已经可以直接用CSS3来实现。但是虽然如此，很多浏览器对CSS3的支持还都是通过其私有属性来达到支持的，鲜有直接对W3C的标准来实现的。诸如firefox的-moz-和webkit的-webkit-属性前缀。 不过CSS3本身W3C也并未有正式版发布，现在还只是草案。下面我推荐两个很直观的，可视化的，自动生成CSS3样式代码的工具网站给大家。 1.CSS3 Generator 选择自己想要的CSS3属性，然后填写数值，右边便可直观的展示出效果了，然后你复制生成的样式代码即可。并且还列出了兼容这些样式的浏览器。可谓十分的方便。 http://www.css3generator.com/ 2.CSS3, please! 这个看起来就更加的直观了，就像做填空题一样，在网页上填写相应的数值，右上角的元素就会呈现出相应的样式。如果你不需要组合这么多效果的话，关闭掉某一些样式属性即可。可以点击“{toggle rule on} ”或者“{toggle rule off} ”来开启单项属性或者关闭。 http://css3please.com/ 正如前面所说，CSS3目前还是个草案，并且因为浏览器的关系，目前只有非主流浏览器支持，你知道的，所谓的主流浏览器就是占据了半壁多江山的IE系列了。IE系列目前只有IE8支持很少一部分的CSS3，未来的IE9倒是或许值得期待。 CSS3组合的好用的恰当确实可以使页面显示的很美观，可是如果只是为了CSS3而CSS3，诸如乱用text-shadow只是为了文字阴影而阴影个人觉得使完全没有必要的。 祝大家CSS3使用愉快。呃。 本文地址:http://leeiio.me/css3-generator-tools/截至您的阅读器抓取时已有评论 12 条,欢迎您也过来留下您的意见 !©Copyright 2007-2009 Leeiio Chaos Made http://Leeiio.me本站更換RSS地址：http://feed.leeiio.me，麻煩大家更新下，謝謝！ 声明: 本站遵循 署名-非商业性使用-相同方式共享 3.0 共享协议. 转载请注明转自 Leeiio.me 消失的CSS3 box-shadow 属性? (12)浏览器专属 CSS Hack:区分 Firefox / Opera / Safari / Internet Explorer (28)CSS 改变选取文字的颜色(CSS3 &amp;#8211; 目前 Firefox/Safari only) [...]&lt;img src=&quot;http://www1.feedsky.com/t1/406711537/1studio/feedsky/s.gif?r=http://leeiio.me/css3-generator-tools/&quot; border=&quot;0&quot; height=&quot;0&quot; width=&quot;0&quot; style=&quot;position:absolute&quot; /&gt;</description><category>設計資源</category><category>CSS3 Generator</category><category>CSS3 Please</category><category>css3</category><pubDate>Thu, 01 Apr 2010 22:54:18 +0800</pubDate><author>Leeiio</author><comments>http://leeiio.me/css3-generator-tools/#comments</comments><guid isPermaLink="false">http://leeiio.me/?p=1972</guid><dc:creator>Leeiio</dc:creator><fs:srclink>http://leeiio.me/css3-generator-tools/</fs:srclink><fs:srcfeed>http://leeiio.me/feed/</fs:srcfeed><fs:itemid>feedsky/1studio/~7316938/406711537/4400837</fs:itemid></item><item><title>转换你的 Subversion 到 Git</title><link>http://leeiio.me/convert-subversion-to-git/</link><content:encoded>&lt;p class=&quot;fswww1&quot;&gt;&lt;a href=&quot;http://www1.feedsky.com/r/l/feedsky/1studio/406711538/art01.html&quot; target=&quot;_blank&quot;&gt;&lt;img border=&quot;0&quot; ismap=&quot;ismap&quot; src=&quot;http://www1.feedsky.com/r/i/feedsky/1studio/406711538/art01.gif&quot; onerror=&quot;this.style.display='none'&quot; /&gt;&lt;/a&gt;&lt;/p&gt;&lt;p&gt;&lt;img src=&quot;http://imgs.leeiio.me/blogimgs/2010/03/20100330_svntogit.png&quot; alt=&quot;转换你的 Subversion 到 Git&quot; /&gt;&lt;br /&gt;
当我发现我很感兴趣的项目都被其作者托管在&lt;a href=&quot;http://github.com&quot; rel=&quot;nofollow&quot;&gt;Github&lt;/a&gt;的时候，让我萌生了对Git的好奇。虽然我已是如此的奥特曼，但是还是有必要写出来分享给其他还未接触 Git 的人的。之前我有介绍过&lt;a href=&quot;http://leeiio.me/googlecode-converting-svn-to-hg/&quot;&gt;《在Google Code上用 Mercurial 取代 Subversion 管理你的项目》&lt;/a&gt;，其实就是教大家如何把 SVN 转换到 Mercurial 且保留全部的历史记录。本文讲的则是另外一则，是教大家如何转换 SVN 到 Git，网上其实有不少的教程，但是都没有从 SVN 的 tags 到 Git 的 tags，本文提供了另外一则转换的指南，如果有不妥的地方，望请 Git 高手指教并指正。&lt;br /&gt;
&lt;span id=&quot;more-1943&quot;&gt;&lt;/span&gt;&lt;/p&gt;
&lt;h2 class=&quot;part-title&quot;&gt;1.安装 Git&lt;/h2&gt;
&lt;p&gt;首先，你需要安装带有 &lt;a href=&quot;http://www.kernel.org/pub/software/scm/git/docs/git-svn.html&quot; rel=&quot;nofollow&quot;&gt;git-svn&lt;/a&gt; 的 Git(git-svn 可以让你 SVN 和 Git并用，如果你打算使用 Git 又不想转变你的 SVN版本库，这会是一种很好的解决方案，不过本文只是利用git-svn来一次性转换你的 SVN版本库 为 Git。)&lt;/p&gt;
&lt;p&gt;你可以在这里下载安装Git：&lt;a href=&quot;http://git-scm.com/download&quot; rel=&quot;nofollow&quot;&gt;http://git-scm.com/download&lt;/a&gt;。最新版似乎都有集成git-svn，至少我安装完以上地址提供的编译好的版本，在 Terminal 里输入 git svn会有提示&amp;#8221;Not a git repository&amp;#8221;。&lt;/p&gt;
&lt;p&gt;如果你正在使用MAC OS X，你应该已经用过 MacPorts了吧，那么：&lt;/p&gt;

&lt;div class=&quot;wp_syntax&quot;&gt;&lt;div class=&quot;code&quot;&gt;&lt;pre class=&quot;bash&quot; style=&quot;font-family:monospace;&quot;&gt;prompt&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;gt;&lt;/span&gt; &lt;span style=&quot;color: #c20cb9; font-weight: bold;&quot;&gt;sudo&lt;/span&gt; port &lt;span style=&quot;color: #c20cb9; font-weight: bold;&quot;&gt;install&lt;/span&gt; git-core +&lt;span style=&quot;color: #c20cb9; font-weight: bold;&quot;&gt;svn&lt;/span&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;Ubuntu 或者 Debian Linux用户:&lt;/p&gt;

&lt;div class=&quot;wp_syntax&quot;&gt;&lt;div class=&quot;code&quot;&gt;&lt;pre class=&quot;bash&quot; style=&quot;font-family:monospace;&quot;&gt;prompt&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;gt;&lt;/span&gt; &lt;span style=&quot;color: #c20cb9; font-weight: bold;&quot;&gt;sudo&lt;/span&gt; &lt;span style=&quot;color: #c20cb9; font-weight: bold;&quot;&gt;apt-get&lt;/span&gt; &lt;span style=&quot;color: #c20cb9; font-weight: bold;&quot;&gt;install&lt;/span&gt; git-svn&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;h2 class=&quot;part-title&quot;&gt;2.创建作者文件&lt;/h2&gt;
&lt;p&gt;下一步，创建一个文本文件来映射 Subversion 的提交者到 Git 的作者使历史记录里的名字和email地址正确显示。保存成authors.txt：&lt;/p&gt;

&lt;div class=&quot;wp_syntax&quot;&gt;&lt;div class=&quot;code&quot;&gt;&lt;pre class=&quot;text&quot; style=&quot;font-family:monospace;&quot;&gt;guaniu = Leeiio &amp;lt;xxx@xxx.com&amp;gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;h2 class=&quot;part-title&quot;&gt;3.克隆(clone)版本库&lt;/h2&gt;
&lt;p&gt;现在来运行命令导入你的svn版本库为一个本地的Git版本库。&lt;br /&gt;
我假定你的 svn 版本库有标准的 /trunk,/tags 以及/branches。&lt;/p&gt;

&lt;div class=&quot;wp_syntax&quot;&gt;&lt;div class=&quot;code&quot;&gt;&lt;pre class=&quot;bash&quot; style=&quot;font-family:monospace;&quot;&gt;prompt&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;gt;&lt;/span&gt; git &lt;span style=&quot;color: #c20cb9; font-weight: bold;&quot;&gt;svn&lt;/span&gt; clone &lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;lt;&lt;/span&gt;SVN版本库地址&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;gt;&lt;/span&gt; &lt;span style=&quot;color: #660033;&quot;&gt;--no-metadata&lt;/span&gt; &lt;span style=&quot;color: #660033;&quot;&gt;-A&lt;/span&gt; authors.txt &lt;span style=&quot;color: #660033;&quot;&gt;-t&lt;/span&gt; tags &lt;span style=&quot;color: #660033;&quot;&gt;-b&lt;/span&gt; branches &lt;span style=&quot;color: #660033;&quot;&gt;-T&lt;/span&gt; trunk &lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;lt;&lt;/span&gt;转换的目的目录名&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;gt;&lt;/span&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;比如以我的google code上的svn为例：&lt;/p&gt;

&lt;div class=&quot;wp_syntax&quot;&gt;&lt;div class=&quot;code&quot;&gt;&lt;pre class=&quot;bash&quot; style=&quot;font-family:monospace;&quot;&gt;prompt&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;gt;&lt;/span&gt; git &lt;span style=&quot;color: #c20cb9; font-weight: bold;&quot;&gt;svn&lt;/span&gt; clone http:&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;//&lt;/span&gt;leeiio.googlecode.com&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;/&lt;/span&gt;svn&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;/&lt;/span&gt; &lt;span style=&quot;color: #660033;&quot;&gt;--no-metadata&lt;/span&gt; &lt;span style=&quot;color: #660033;&quot;&gt;-A&lt;/span&gt; authors.txt &lt;span style=&quot;color: #660033;&quot;&gt;-t&lt;/span&gt; tags &lt;span style=&quot;color: #660033;&quot;&gt;-b&lt;/span&gt; branches &lt;span style=&quot;color: #660033;&quot;&gt;-T&lt;/span&gt; trunk Leeiio&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;现在，你可以运行 git log 命令，你将会看到你全部的提交历史记录以及正确显示的提交者作者名。&lt;/p&gt;
&lt;h2 class=&quot;part-title&quot;&gt;4.转换branches 为 tags&lt;/h2&gt;
&lt;p&gt;现在还需要做一步处理。目前你全部的 tags 在 Git 的版本库里都成了 branches(分支)，并不是 tags。所以你需要手动转换它们。对于每一个 svn 的 tag你都将转换为 Git 的 tag，然后删除全部的 branch。用以下的命令列出：&lt;/p&gt;

&lt;div class=&quot;wp_syntax&quot;&gt;&lt;div class=&quot;code&quot;&gt;&lt;pre class=&quot;bash&quot; style=&quot;font-family:monospace;&quot;&gt;promp&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;gt;&lt;/span&gt; git branch &lt;span style=&quot;color: #660033;&quot;&gt;-r&lt;/span&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;然后列出所有的tag：&lt;/p&gt;

&lt;div class=&quot;wp_syntax&quot;&gt;&lt;div class=&quot;code&quot;&gt;&lt;pre class=&quot;bash&quot; style=&quot;font-family:monospace;&quot;&gt;prompt&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;gt;&lt;/span&gt; git tag tagname tags&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;/&lt;/span&gt;tagname
prompt&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;gt;&lt;/span&gt; git branch &lt;span style=&quot;color: #660033;&quot;&gt;-r&lt;/span&gt; &lt;span style=&quot;color: #660033;&quot;&gt;-d&lt;/span&gt; tags&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;/&lt;/span&gt;tagname&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;现在，你就有了一个本地的 Git 版本库了，包含了所有的历史记录以及 tags。&lt;/p&gt;
&lt;h2 class=&quot;part-title&quot;&gt;5.Push(推送)到一个公共的版本库&lt;/h2&gt;
&lt;p&gt;当然如果你并不想在网上分享你的 Git 版本库，这一步的操作你大可不必了。&lt;br /&gt;
以 github 为例：&lt;/p&gt;

&lt;div class=&quot;wp_syntax&quot;&gt;&lt;div class=&quot;code&quot;&gt;&lt;pre class=&quot;bash&quot; style=&quot;font-family:monospace;&quot;&gt;prompt&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;gt;&lt;/span&gt; git remote add origin git&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;@&lt;/span&gt;github.com:userid&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;/&lt;/span&gt;project.git
prompt&lt;span style=&quot;color: #000000; font-weight: bold;&quot;&gt;&amp;gt;&lt;/span&gt; git push origin master &lt;span style=&quot;color: #660033;&quot;&gt;--tags&lt;/span&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;Well Done!一切搞定了。开始你的 Git 之旅吧。&lt;/p&gt;
&lt;p&gt;最后，附送一个为 SVN用户过渡到Git的&lt;a href=&quot;http://git.or.cz/course/svn.html&quot; rel=&quot;nofollow&quot;&gt;使用手册&lt;/a&gt;。&lt;/p&gt;
&lt;p&gt;Via. &lt;a href=&quot;http://pauldowman.com/2008/07/26/how-to-convert-from-subversion-to-git/&quot; rel=&quot;nofollow&quot;&gt;How to convert from Subversion to Git&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;本文地址:&lt;a href=&quot;http://leeiio.me/convert-subversion-to-git/&quot;&gt;http://leeiio.me/convert-subversion-to-git/&lt;a&gt;&lt;/p&gt;截至您的阅读器抓取时已有评论&lt;strong&gt; 9 &lt;/strong&gt;条,欢迎您也过来留下您的意见 !&lt;hr /&gt;©Copyright 2007-2009 Leeiio Chaos Made &lt;a href=&quot;http://leeiio.me&quot; target=&quot;_blank&quot;&gt;http://Leeiio.me&lt;/a&gt;&lt;br /&gt;&lt;font style=&quot;font-size:15px;font-weight:bold&quot;&gt;本站更換RSS地址：&lt;a href=&quot;http://feed.leeiio.me&quot; title=&quot;戳我訂閱最新rss地址&quot;&gt;&lt;font color=&quot;red&quot;&gt;http://feed.leeiio.me&lt;/font&gt;&lt;/a&gt;，麻煩大家更新下，謝謝！&lt;/font&gt;&lt;br /&gt;
&lt;p&gt;&lt;strong&gt;声明:&lt;/strong&gt; 本站遵循 &lt;a href=&quot;http://creativecommons.org/licenses/by-nc-sa/3.0/&quot;&gt;署名-非商业性使用-相同方式共享 3.0&lt;/a&gt; 共享协议. 转载请注明转自 &lt;a href=&quot;http://leeiio.me&quot;&gt;Leeiio.me&lt;/a&gt;
&lt;img src=&quot;http://img.tongji.linezing.com/990626/tongji.gif&quot;/&gt;&lt;/p&gt; &lt;ul class=&quot;related_post&quot;&gt;&lt;li&gt;&lt;a href=&quot;http://leeiio.me/bluehost-x86-64-subversion-svn/&quot; title=&quot;在 Bluehost 主机上安装 Subversion(SVN),支持 64 位主机&quot;&gt;在 Bluehost 主机上安装 Subversion(SVN),支持 64 位主机&lt;/a&gt; (14)&lt;/li&gt;&lt;li&gt;&lt;a href=&quot;http://leeiio.me/googlecode-converting-svn-to-hg/&quot; title=&quot;在Google Code上用 Mercurial 取代 Subversion 管理你的项目&quot;&gt;在Google Code上用 Mercurial 取代 Subversion 管理你的项目&lt;/a&gt; (11)&lt;/li&gt;&lt;/ul&gt;&lt;img src=&quot;http://www1.feedsky.com/t1/406711538/1studio/feedsky/s.gif?r=http://leeiio.me/convert-subversion-to-git/&quot; border=&quot;0&quot; height=&quot;0&quot; width=&quot;0&quot; style=&quot;position:absolute&quot; /&gt;</content:encoded><wfw:commentRss>http://leeiio.me/convert-subversion-to-git/feed/</wfw:commentRss><slash:comments>9</slash:comments><description>&lt;p class=&quot;fswww1&quot;&gt;&lt;a href=&quot;http://www1.feedsky.com/r/l/feedsky/1studio/406711538/art01.html&quot; target=&quot;_blank&quot;&gt;&lt;img border=&quot;0&quot; ismap=&quot;ismap&quot; src=&quot;http://www1.feedsky.com/r/i/feedsky/1studio/406711538/art01.gif&quot; onerror=&quot;this.style.display='none'&quot; /&gt;&lt;/a&gt;&lt;/p&gt;当我发现我很感兴趣的项目都被其作者托管在Github的时候，让我萌生了对Git的好奇。虽然我已是如此的奥特曼，但是还是有必要写出来分享给其他还未接触 Git 的人的。之前我有介绍过《在Google Code上用 Mercurial 取代 Subversion 管理你的项目》，其实就是教大家如何把 SVN 转换到 Mercurial 且保留全部的历史记录。本文讲的则是另外一则，是教大家如何转换 SVN 到 Git，网上其实有不少的教程，但是都没有从 SVN 的 tags 到 Git 的 tags，本文提供了另外一则转换的指南，如果有不妥的地方，望请 Git 高手指教并指正。 1.安装 Git 首先，你需要安装带有 git-svn 的 Git(git-svn 可以让你 SVN 和 Git并用，如果你打算使用 Git 又不想转变你的 SVN版本库，这会是一种很好的解决方案，不过本文只是利用git-svn来一次性转换你的 SVN版本库 为 Git。) 你可以在这里下载安装Git：http://git-scm.com/download。最新版似乎都有集成git-svn，至少我安装完以上地址提供的编译好的版本，在 Terminal 里输入 git svn会有提示&amp;#8221;Not a git repository&amp;#8221;。 如果你正在使用MAC OS X，你应该已经用过 MacPorts了吧，那么： prompt&amp;#62; sudo port [...]&lt;img src=&quot;http://www1.feedsky.com/t1/406711538/1studio/feedsky/s.gif?r=http://leeiio.me/convert-subversion-to-git/&quot; border=&quot;0&quot; height=&quot;0&quot; width=&quot;0&quot; style=&quot;position:absolute&quot; /&gt;</description><category>設計資源</category><category>SVN</category><category>Subversion</category><category>Git</category><category>Github</category><pubDate>Tue, 30 Mar 2010 21:08:11 +0800</pubDate><author>Leeiio</author><comments>http://leeiio.me/convert-subversion-to-git/#comments</comments><guid isPermaLink="false">http://leeiio.me/?p=1943</guid><dc:creator>Leeiio</dc:creator><fs:srclink>http://leeiio.me/convert-subversion-to-git/</fs:srclink><fs:srcfeed>http://leeiio.me/feed/</fs:srcfeed><fs:itemid>feedsky/1studio/~7316938/406711538/4400837</fs:itemid></item></channel></rss>