技术类Blog在成长过程中总会遇到使用代码的情况，你是用什么方式显示代码的呢？ NetPuter 是用插件（ WP-Syntax ）实现的，这款插件优点就是简洁，支持的语言语法很多。但我在使用过程中也发现了一个问题，就是不会自动换行。感觉很多人也会遇到这个问题，今天就来告诉大家如何通过 CSS 使 WP-Syntax 等利用PRE标签的插件自动换行！

让 PRE 标签自动换行

为了方便演示，本文的效果都是截图，而代码则来自《WordPress 技巧：在 SEO 面前砍掉多余内容》。

首先，我们先来看看 WP-Syntax 原始效果：

嗯，如果不是在代码中换行，代码就会整一行的显示出来。根据源码我们可以发现在pre标签中显示代码的名为 Code 的 Class ，因此我们就能针对其进行修改啦！请出超强大的 CSS ！

1 2 3 4 5 6

.code pre{ word-wrap:break-word; /* 内容将在边界内换行。如果需要，词内换行( word-break )也将发生。 */ word-break:break-all; /* 允许在词间换行， 也允许非亚洲语言文本行的任意字内断开。该值适合包含一些非亚洲文本的亚洲文本。 */ white-space:normal; /* 文本自动处理换行。假如抵达容器边界内容会转到下一行。 */ }

把这段代码插入到主题目录的 style.css 的屁股（其实想插哪儿都可以），然后你会发现代码变成酱紫了：

代码的确都自动换行了，但是有行号的话就会对不上。其实，对于 WP-Syntax 来说是不可能实现行号相对应且代码自动换行的。因为 WP-Syntax 是使用一个表格来显示代码，而左列是行号，右列是代码。如果你想又行号对应，又自动换行的话，可以考虑使用 CoolCode 这款插件，它是采用 li 的方式显示每一行代码的，但插件本身也不支持自动换行，但是你可以参考上面提供的代码SM下 CoolCode 哦。XD

因此，现在就只有实现无行号自动换行、有行号不换行咯，瞎蒙了下居然可以实现了（不知道为啥）：

1 2 3 4

.code pre{ word-wrap:break-word; word-break:break-all; }

然后就变成这鸟样了：

OK！但至于为什么呢我就不知道了，有童鞋可以告诉我吗？

关于如何在非IE浏览器实现此效果，可以看看 Leeiio 童鞋的《讓你的< pre >< /pre > 能自動換行》。

今天是11月1日，我们第二期的OrZine又与大家见面了！继续上期的推视频和推Feed，同样，本期OrZine也接着向大家推荐视频和Feed。Go！

[推视频]鲜果老大说RSS成为大众应用仍需漫长摸索

精彩观点

1. RSS发展4年里面，大部分都是技术发烧友和IT互联网行业从业者，做传统媒体和比较敏锐的那部分人也开始使用RSS，这正好是传播的过程，前途是光明的，但是现在来讲的话是比较吃苦、难熬的过程。
2. 2008年对RSS行业很关键，经济形势不乐观，看你如何撑下去，如果国内做RSS的这些公司不撑下去很可惜，如果撑下去的话，慢慢发展，将成为大众化的应用。
3. 天健还拥有企业外包、资询服务等业务，有资金能够把鲜果延续下去，做鲜果更多的是理想，回报什么的可能看得稍微少一点，现在鲜果没有做任何盈利的尝试，现在主要还是想把产品做好。
4. 开放API接口在国内刚刚开始做，中间会有利益观念和安全的问题，因为开放的话，一定会带来很多挑战，这个还是得慢慢来，我们已经把最难的部分先做了，后面应当会有更多合作。
5. 对于鲜果，我本身还是有较多期望，我不期望卖给大公司，我期望能够尽力把这创新和产品细节做好，出售很多时候对于创新也会有影响。
6. 创业的人都是比较有才华的，往往会陷入一个误区，比较自我。要把心态放开，心态要平和一些，这样和别人合作的时候，才能够得到一个比较好的结果。
7. 更多观点，看看聊天实录吧。

这一段视频对我的启发很大，我非常喜欢RSS，我相信RSS技术总有一天会成为主流的！

[推Feed]

• Feed名称：CSS Web Design 我爱CSS
• Feed地址：http://www.52css.com/feed.asp
• Blog地址：http://www.52css.com/
• Feed预览：
  
• Feed介绍：某次对CSS兴趣大发时发现了这个站点，非常实用！我也从里面学习到不少的CSS技巧，下载到不少的CSS模板。里面的资源足以让你对CSS的了解更上一层楼！强烈推荐订阅！

PS：貌似本期OrZine有点儿太“技术”了，欢迎向OrZine推荐好看好玩好用的视频、Feed……！

感觉又是一篇标题党入党申请书的范文，呵呵~

直接进入正题，童鞋（好像你们不喜欢看到童鞋这个词，如果是的话我可以改口）喜欢在侧边栏显示最新文章、最新评论、饭否最新动态以及其他的信息，但是如果显示的内容太多又会导致页面不美观，直接砍掉多余的内容吧，可能会不好看，再者影响SEO。有没有……有，当然有。今天NetPuter就给大家介绍下如何在SEO面前砍掉多余内容。（感觉今天的这个情景预设的不好T^T）

先让我看看效果吧

• 这个是没有砍掉前的效果，多余的内容很多。
  
• 我砍！页面整齐了吧，一行就是一行，你敢跨？我就砍！
  

如何在SEO面前砍掉多余内容

CSS，又是CSS。代码如下：

1 2 3 4 5 6 7

<style type="text/css"> #sidebar { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } </style>

这里简单解释下这3个CSS参数是什么：

1. overflow:hidden：不显示超过对象尺寸的内容
2. text-overflow:ellipsis：当对象内文本溢出时显示省略标记“...”
3. white-space:nowrap：强制在同一行内显示所有文本，直到文本结束或者遭遇 br 对象。

具体大家可以参考CSS中文手册，遇到不熟的属性都可以参考下。

然后呢，把上面的CSS代码添加到主题目录下的style.css中相关位置就可以啦。

PS1：最近还是在整蛊WordPress主题，好折腾别人的主题却又达不到自己想要的效果，自己要做一个又没有灵感，哎~
PS2：感觉又写得很糟糕，哎~
PS3：原本显示在首页的Links我已经搬到了这里，和“传统”的Links页面不一样哦，另外需要申请Links的童鞋也可以到这里留言申请。