这两天利用圣诞节一点时间重新看了一下5D的教程:用 CSS(XHTML)制作模版(2):简单图解结构与表现分离,有点豁然开朗,呵呵~限于时间,我暂主要解决一下底部版权说明部分的实现~现在看大部分的底部版权说明部分主要是通过Footer中加入图片,这个有很大的局限性(我觉得如此-_-"),比如要加个Powered by 5D,通常我们会给“5D”加上个链接,如果用图片显然实现不了。下面是我的一个作法:
首先进入模板自定义,进入代码模式,在页面底部加上:
<DIV class=hstable>
<DIV class=hs>Copyright 2005-2008 Powered By <A href="http://blog.5d.cn" target=_blank>5Dblog </A>Designed by 水南 </DIV> </DIV>
/*这里的hstable是自已定的一个表格,名字自取,不要和原模板的重了就可以了,而hs定义这个表格中文字,PS:返回到可视化编辑后,你可相应的改字体的属性*/
好了,现在我们编好了一个新的“表格”到模板中了,剩下的就是要CSS样式中也即是“修改样式代码”中来定位这个表格的位置,及相关的属性。不过在此之前,我们必须重新生成页面,我们可以先生成首页的页面,等做好后再生成所有页面。我的代码是(在原代码底部加,原则是任何地方都可以,这里只不过为了改起来好找):
.hstable{width:771px;float:clearboth;background:#BBB;margin-left:auto;margin-right:auto;border-top:1px solid blue;}
.hs{color:blue;text-align:center} /*这里第一句显然是定义我们刚才增加的表格的属性,这里我设了背景色,及表格上边颜色及宽度,float 是用来控制位置的,第二句是控制表格内字体的颜色及文字显示的位置,当然还有其它参数,这和其它CSS样式是一样的*/
问题:这有可能为我们能够在底部插入一些诸如音乐代码提供一个想法~
不过这样定义出来的东西在一些浏览器(如opera)中页面就乱了,不知什么原因,大概是不规范,呵呵!所以如果追求通用性,可能还要通过CSS样式做相应的修改?
一些浅显的认识,暂就这么多吧~效果可看本页的底部~当然这只是一种思路而已,事实上可以直接在模板自定义中使用footer的定义直接给出。因为fooer本身就是底部框架?所以不必重复定义~呵呵~