DZX 1:1:1 ，1:2:1，N:N:N框架修改（任意宽度3列框架修改）适合6月1日后正式版本

原帖作者：https://discuz.dismall.com/thread-1690893-1-1.html

感谢原作者提供这么好的东西，不过本人发现他的代码有一些小问题，造成修改之后框架点击无反应！

经过自己的小小研究，修正了一点点很渺小的东西。

我们要做好孩子，看到好东西，要习惯性的回帖！


想偷懒的，直接下载压缩包，覆盖到template\default\common\目录下进行覆盖（请确保压缩包里的两个文件，你没有进行修改！）。然后将下面的第一步完成即可！


下面是手动修改的方式
1，上传图片到static\image\diy\目录下
下载图片改名为：layout-1-2-1.png




2，修改default\common\header_diy.htm 文件 搜索

1. <ul id="contentframe" class="content hide">
   
2. <li><a href="javascript:;" id="frame_1" data="$widthstr"><img src="{STATICURL}image/diy/layout-1.png" />100%{lang header_frame}</a></li>
   
3. <li><a href="javascript:;" id="frame_1_1"><img src="{STATICURL}image/diy/layout-1-1.png" />1:1</a></li>
   
4. <li><a href="javascript:;" id="frame_1_2"> <img src="{STATICURL}image/diy/layout-1-2.png" />1:2</a></li>

复制代码

下方添加代码：

1. <li><a href="javascript:;" id="frame_1_2_1"><img src="{STATICURL}image/diy/layout-1-2-1.png" />1:2:1</a></li>
   

复制代码

3、修改default\common\common.css 文件

1. /* 新的框架结构 */
   
2. .frame-1-1-l, .frame-1-1-1-l, .frame-1-1-1-c, .frame-2-1-l, .frame-1-2-l, .frame-3-1-l, .frame-1-3-l { float: left; }
   
3. .frame-1-1-r, .frame-1-1-1-r, .frame-2-1-r, .frame-1-2-r, .frame-3-1-r, .frame-1-3-r { float: right; }
   
4. .frame-1-1-l, .frame-1-1-r { width: 49.9% }
   
5. .frame-1-1-1-l, .frame-1-1-1-c, .frame-1-1-1-r, .frame-2-1-r, .frame-1-2-l { width: 33.3%; }
   
6. .frame-2-1-l, .frame-1-2-r { width: 66.6%; }
   
7. .frame-3-1-l, .frame-1-3-r { width: 74.9%; }
   
8. .frame-3-1-r, .frame-1-3-l { width: 24.9%; }
   
9. /* End */

复制代码

替换成：

1. /* 新的框架结构 */
   
2. .frame-1-1-l, .frame-1-1-1-l, .frame-1-1-1-c, .frame-1-2-1-l, .frame-1-2-1-c, .frame-2-1-l, .frame-1-2-l, .frame-3-1-l, .frame-1-3-l { float: left; }
   
3. .frame-1-1-r, .frame-1-1-1-r, .frame-1-2-1-r, .frame-2-1-r, .frame-1-2-r, .frame-3-1-r, .frame-1-3-r { float: right; }
   
4. .frame-1-1-l, .frame-1-1-r { width: 49.9% }
   
5. .frame-1-1-1-l, .frame-1-1-1-c, .frame-1-1-1-r, .frame-2-1-r, .frame-1-2-l { width: 33.3%; }
   
6. .frame-1-2-1-l { float: left; width: 29.9%; }
   
7. .frame-1-2-1-c{ float: left; width: 49.9%; }
   
8. .frame-1-2-1-r { float: right; width: 20.2%; }
   
9. .frame-2-1-l, .frame-1-2-r { width: 66.6%; }
   
10. .frame-3-1-l, .frame-1-3-r { width: 74.9%; }
    
11. .frame-3-1-r, .frame-1-3-l { width: 24.9%; }
    
12. /* End */

复制代码

然后记得  台后-工具- 更新缓存。。前台就可以了。

如果想任意宽度3列框架，那么只需要修改，就可以任意布局了 如果是默认模板需要算好总的宽度哦不能大于99%，官方默认的站是970px的宽度，如果用固定宽度也要略小于这个.

1. .frame-1-2-1-l { float: left; width: 左边宽度; }
   
2. .frame-1-2-1-c{ float: left; width: 中间宽度; }
   
3. .frame-1-2-1-r { float: right; width: 右边宽度; }

复制代码

楼主把那两个文件打包下载吧，谢谢了

为这问题郁闷一大早了

盗版啊，，，，，郁闷死

盗版啊，，，，，郁闷死
xiqi 发表于 2010-6-3 10:51

我加原作者版权了，属于正当转载！

回复 1# 东莞网…子涵 的帖子


    子涵，不错。。

N:N:N不就是1:1:1嗎?
X:Y:Z?

为什么我的死活不按新比例显示出来啊

.frame-1-2-1-l { float: left; width: 29.9%; }
.frame-1-2-1-c{ float: left; width: 49.9%; }
.frame-1-2-1-r { float: right; width: 20.2%; }
.frame-2-1-l, .frame-1-2-r { width: 66.6%; }
.frame-3-1-l, .frame-1-3-r { width: 74.9%; }
.frame-3-1-r, .frame-1-3-l { width: 24.9%; }
/* End */

为什么我的列宽依旧

..................