首先感谢Slim-cn发现了可以实现绝对和相对定位的语法,通过这段语法可以实现在空间版面的任何位置添加文字、图片及视频的效果。前两天我试着做了一个文本导航条,昨天又改动了一下,换成按钮的方式,看上去美观多了。通过这种办法可以将一些固定内容放到版面的空闲处,从而解放出更多的列表资源。但需要提醒大家的是,不要过多地在页面上添加内容,一方面影响了整体观感,另一方面也拖慢了空间的载入速度,凡事要适可而止,以免重蹈前两天嵌入JS被锁的覆辙。
我使用的就是下面这段语法(出处:有话好好说 Slim-cn,建议大家去这里看看,有很漂亮的日志模版)
<DIV class=LayoutIBeam style="DISPLAY: block; LEFT: ???px; WIDTH: ???px; TOP: ??px; HEIGHT: ??px;BORDER-COLLAPSE: separate;TABLE-LAYOUT: auto;"> <IMG height=60 alt=xxxxx src="图片地址" width=468 border=0></DIV>
简单解释一下:
<IMG height=.......>控制图片文件,这个没什么可说的,想必大家已经接触很多次了。这里也可以不使用图片,而直接输入文字,或替换成添加视频的语法。
<DIV class=LayoutIBeam.......>控制图片、文本或视频出现的位置,这是个绝对定位命令。其中的WIDTH和HEIGHT还是对添加的图片大小的描述,而TOP是指该图片或文本与页面最顶端的距离,LEFT则是指这些元素与页面最左端的距离。
语法的使用并不困难,照葫芦画瓢即可。关键是如何准确的定位各元素出现的位置。我采用了一种比较笨,但却很实用的办法。先用抓屏软件将整个首页面的版面上方截取下来,然后用图形处理软件打开,再将所需添加的图片或文字粘贴到刚刚截取的图片上,这样你不仅可以看到将来实现时的效果,也可以通过图形处理软件的标尺或状态栏读取添加的图片或文字的坐标位置,而该位置就是将来需要调整的LEFT及TOP值。
确定具体位置参数后,你就可以将代码通过HTML语法编辑方式放入首页面的日志中。不过在日志编辑区域及预览里都无法体现最终实现的效果。发布日志后,进入自己的空间看看实际效果,不满意的话再调整一下数值。提醒大家注意,由于该代码是写在日志中的,就如同背景音乐一样,如果该日志已不在首页面了,则添加的那些图片或文字也将不会出现在你的空间首页面上。