dedeCMS模板布局的改变的一个例子
转载请标明是引用于 http://blog.csdn.net/chenyujing5678
欢迎拍砖!
dedeCMS模板布局的改变的一个例子
一、效果变化模板的布局：
更改后的布局：
二、修改方法1、查看原有的代码
在index.htm中，我们用utralEdit打开看到，整个主而一个table，table下分两部分：
<td id="ileft">、<td id="iright">
对应的左右效果如下：
我们来分析一下<td id="ileft">块的内容,含有四部分：
2、找出原因
要达到我们的效果，肯定得改变table里的代码。我们的目标是把<td id="iright">下的第一个元素放到table的最上面
3、开始动手
把目标代码
<div style="background:url({dede:global.cfg_cmspath/}/templets/baobei/images/channel/bgimg0100.jpg) no-repeat 17px 9px; text-align:left;"><img src="{dede:global.cfg_cmspath/}/templets/baobei/images/topimg.gif" width="930" height="258" /></div>搬到table下：
三、总结1、table的使用
从这个例子中我们看到table中在布局中的代码，以<tb>开头定单元格大小时，是以里面大小来动态调节宽度的，而这种调用主要是.css文件来控制。
Eg:如下图所示的class字段
2、学习了div中使用style=”background:url来定义此div背景的方法，然后在前景中用src加入图片.
<div style="background:url({dede:global.cfg_cmspath/}/templets/baobei/images/channel/bgimg0100.jpg) no-repeat 17px 9px; text-align:left;"><img src="{dede:global.cfg_cmspath/}/templets/baobei/images/topimg.gif" width="930" height="258" /></div>
如下图中的代码所示：
3、1 class=”ipro_title1”用来显示标题”产品中心”
它的关键内容是class=”ipro_title1”字段,它的内容如下：
哈哈，定义CSS：.ipro_title1 .left
在用的时候是
如上图所示，它里面又是一个表格
看来做模板的人把内容给写死了，在实际当中要求我们灵活添加的内容能显示出来，看来这里得改一下。
