您的位置:首页 > 编程语言

新浪博客如何显示高亮代码,DIY

2013-08-04 08:51 197 查看
新浪博客对代码的支持功能不尽完美,或者说一点都不好,可是对于一个追求完美的技术痴而言,代码不能够完美的显示,心里总有那么一些不爽,那么如何在新浪中显示那些带颜色的代码呢?经过探究,可以如下设置:

为了将代码与正文分开,我们可以在写博客的时候,点击左下角的显示源代码选项,进入源代码编辑界面,然后
插入一个div作为盛放代码的容器,我的设置非常简单,如下:
--------------------------------------------------------------------------------------------------

<br />
<div style="background-color: #669;">
The place to place your codes......
</div>
<br/>

--------------------------------------------------------------------------------------------------

效果如下:

The place to place your codes......
【注意这里的文字不能少,你可以随便先填写上一些,然后在粘贴代码的时候删去。】

至于背景色完全取决于与你代码颜色的搭配。

然后我们可以找一个书写代码的编辑器,比如说eclipse等,在里面书写代码可以自动高亮。

加入我们书写完了代码,接下来,打开Word,然后将书写好的代码复制粘贴到Word中,你会发现,Word中的代码是高亮的。由于复制的代码没有行号,这时候,我们可以借助Word的编号功能,然后为每一行代码进行编号(当然你也可以不用编号),不过这里有一点需要注意,必须先手动为第一行代码编号,然后选中其余行,再用Word的编号功能进行编号。这一步稍微拐了一个弯,就属于Word排版的只是了,如果不清楚就自己摸索一下,在这里就不再说了。

接下来,在我们已经建立好的div盒子中,我们多敲击几次回车键,把div盒子扩大一些(以防止代码溢出),然后从Word中复制代码进行粘贴,效果如下:



可是这种情况下,仍然会出现div盒子分裂的情况,这是候,我们可以将鼠标指针放到没有代码的盒子中,然后删除掉分裂的div盒子,然而又有麻烦来了,那就是你会发现鼠标的光标在第一个div盒子中出不来了,没有关系,可以解决掉的。你点解右下方的【显示源代码】,然后进入代码编辑界面,你在界面的最下方填上以下代码:

<br/><br/>br/>

然后在返回,看看,是不是跳出盒子了?

附:如果你只是写一行或者说代码行数很少,那么你只要一行一行将eclipse里的代码复制到Word中然后直接再复制到博客上就可以了(不用放在div盒子里),代码会自动连eclipse里的背景色一起拾起。

如果有疑问,我很乐意回答,我的邮箱是1993zzo@163.com
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: