html用框架分割并嵌入页面,嵌入HTML框架

看到有人在他的cublog上将一段C语言代码放到一个带有滚动条的文本框中，觉得很不错，这样不会因为代码过长而导致blog页面变得像裹脚布那样长。我在blog的编辑器上找了好长时间都没有找到那样的功能。这两天看了一会html的资料才知道那种效果用的是iframe标记实现的。这篇文章详细记录了这个问题的解决方法，仅供对html不太感冒却又想要特殊效果的兄弟参考。

1、建立代码页面

将你的程序代码单独做在一个html文件中。可以用一些html可视化编辑器来做，譬如Nvu或mozilla的网页编辑器。我想让代码保持关键字高亮显示，跑到Windows下，用VC＋＋打开一份代码，复制到word中后另存成html文件。还有个比较好的办法，是使用galeki向我推荐的一个在线代码转换为html的网站：实现源码文件转换为高亮的html。这个办法很好，特别是在你没有Word之类的工具使用的时候。

2、上传代码html文件

将你做好的代码html文件上传到你的一些免费空间中。我前段时间申请了一个google主页空间，有100M。这个主页空间允许用户上传任何格式的文件，我就将做好的代码html文件传了上去，文件所在网络地址是

3、在blog中嵌入代码html

在html中，iframe的作用是在一页中间插入一个框架来显示另一个html文件。它是一个封闭标记(即类似...*>这样的标记)，但围堵着的字句只有在浏览器不支持 iframe 标记时才显示，可以放一些提醒的字句之类。

将代码html利用iframe嵌入到blog中很简单，只需要在你的blog编辑器左下方选中“显示源代码的复选框”，添加以下代码即可：

iframe各项属性解释如下：

src="文件路径"

欲显示于此框窗的文件来源除档案名称，必要加上相对或绝对路径。

name="test"

该框架名称，这个在多个框架中比较有用，这里用不大上。

align="MIDDLE"

可选值为 left, right, top, middle, bottom，作用不大。

width="500" height="100"

框架的宽及长，以 pixels 为单位。

marginwidth="1" marginheight="1"

该插入的文件与框边所保留的空间。

frameborder="1"

使用 1 表示显示边框， 0 则不显示。(可以是 yes 或 no)

scrolling="Yes"

使用 Yes 表示允许卷动(内定)， No 则不许

noframes当浏览器不支持frame时起作用。

下面是我在这个blog页面上嵌入以上代码后的效果：

如果要让该frame居中，那么就将上述代码放到

中。

4、结论

我觉得在blog中，引用过长的代码会严重破坏文档的可读性。采用这种方法，解决了我一直都很想实现的blog风格。不过，我发现mozilla的网页编辑器或NVU都不支持iframe标记，我只好用dreamweave来做测试。