繁體
|
簡體
Sclub交友聊天~加入聊天室當版主
(檢舉)
分享
新浪微博
QQ空间
人人网
腾讯微博
Facebook
Google+
Plurk
Twitter
Line
標題:
[版型教學]
【美化技巧】把你的边栏移到左边
[打印本頁]
作者:
bonimon
時間:
2012-12-5 15:30
標題:
【美化技巧】把你的边栏移到左边
方法：
第一步：
查找css_common.htm里的代码：
.with_side .main { float: left; overflow: hidden; margin-left: -180px; width: 100%; }
.with_side .content { margin-left: 180px; width: auto; }
.with_side .side { float: right; padding-bottom: 20px; width: 180px; }
複製代碼
替换成：
本帖隱藏的內容需要回復才可以瀏覽
但是这样边栏靠的太紧，可以自行修改，建议将180改为190
第二步：
查找css_script.htm里的代码：
#sidebar_img { float: right; display: inline; margin: 0 6px; padding: 6px 25px 6px 6px; background: url({IMGDIR}/sidebar_toggle.gif) no-repeat 100% 5px; color: {HIGHLIGHTLINK}; position: relative; z-index:98; }
複製代碼
替换成：
#sidebar_img { float: left; display: inline; margin: 0 6px; padding: 6px 25px 6px 6px; background: url({IMGDIR}/sidebar_toggle.gif) no-repeat 100% 5px; color: {HIGHLIGHTLINK}; position: relative; z-index:98; }
複製代碼
第三步：
进入网站后台，界面－风格管理－选风格－编辑－高级模式－找到侧边背景图那一栏，将repeat-y 100% 0 改成repeat-y 0 100%
第四步：更新ＣＳＳ和更新缓存，两个都要更新。
如果你开启了主题列表页的边栏，那么打开关闭边栏的按钮就会挤在上面很难看，可以作以下修改：
打开：forumdisplay.htm
找到：
<!--{if $infosidestatus[allow] == 2}-->
<a id="sidebar_img" href="javascript:;" onclick="sidebar_collapse(['{lang sidebar_collapsed_yes}', '{lang sidebar_collapsed_no}']);" class="$collapseimg[sidebar]"><!--{if $collapseimg[sidebar] == 'collapsed_yes'}-->{lang sidebar_collapsed_yes}<!--{else}-->{lang sidebar_collapsed_no}<!--{/if}--></a>
<!--{elseif $infosidestatus[allow] == 1}-->
<a id="sidebar_img" href="javascript:;" onclick="sidebar_collapse(['', '{lang sidebar_collapsed_no}']);" class="collapsed_yes">{lang sidebar_collapsed_yes}</a>
<!--{/if}-->
複製代碼
将它剪切下来，移动到：
<div class="main">
<div class="content">
$pluginhooks[forumdisplay_top]
<!--{if $forum['recommendlist'] || $forum['rules']}-->
<div id="modarea" class="s_clear">
<div class="list">
<span class="headactions"><img onclick="toggle_collapse('modarea_c');" alt="{lang spread}" title="{lang spread}" src="{IMGDIR}/$collapseimg[modarea_c].gif" id="modarea_c_img" class="toggle" /></span>
<h3>
複製代碼
的上面。
作者:
4rphotoclub
時間:
2012-12-5 16:11
先來收下藍大的教材啊
作者:
酷炫o蒸蛋
時間:
2012-12-5 16:30
提示:
作者被禁止或刪除 內容自動屏蔽
作者:
liangweisee
時間:
2012-12-5 16:37
换个位置不错
作者:
pigeon
時間:
2012-12-5 18:40
有预览图片吗
作者:
达人小G
時間:
2012-12-6 05:37
感谢分享^_^，看看！
作者:
达人小G
時間:
2012-12-6 05:37
严重支持蓝大原创代码
作者:
章鱼
時間:
2012-12-6 10:35
话说似乎以前有一段css可以直接把边栏放左边？
作者:
tryqtyl
時間:
2013-1-18 18:38
开始用边栏了，学习一下
作者:
cncanarias
時間:
2013-2-24 07:08
支持下下 学习中
作者:
lrm1998mods
時間:
2013-3-2 20:48
提示:
作者被禁止或刪除 內容自動屏蔽
作者:
skycd520
時間:
2013-3-10 19:25
Thank your for sharing
作者:
3526639
時間:
2013-3-20 23:03
太感谢咯
作者:
流传动
時間:
2013-3-21 09:23
有点复杂啊看其阿里
作者:
lxqhl
時間:
2013-4-4 11:36
支持下下 学习中
作者:
82817676
時間:
2013-4-4 11:51
看看,学习下,虽然不懂- -
作者:
lovesclub225
時間:
2013-5-17 15:07
很給力 謝
作者:
Magnificent
時間:
2013-5-22 16:14
回复看看，无图是不懂的
作者:
kyh991
時間:
2013-5-22 18:57
村子哦草
作者:
赤泽泉美
時間:
2013-5-22 19:56
感谢分享
作者:
蒼野Aono
時間:
2013-5-23 04:13
謝謝分享噢！
作者:
s522300855
時間:
2013-5-23 12:31
学习中 论坛创建中！！！
作者:
JDE
時間:
2013-6-10 09:48
支持下下 学习中
作者:
luluxiuMUGEN
時間:
2013-6-11 14:48
不错= =感谢
作者:
meifa
時間:
2013-8-2 11:23
回復
1#
bonimon
试试
作者:
奎鑫
時間:
2013-9-20 20:42
有没搞错这还要隐藏啊!!!!
作者:
情蕭
時間:
2014-1-3 04:14
感谢分享~~~~~~~~
作者:
hack8s
時間:
2014-1-15 01:24
支持一下
作者:
superman1024
時間:
2014-1-15 01:37
感謝分享
作者:
wolong
時間:
2014-2-8 22:58
哈哈哈哈哈合乎
作者:
南柯一梦
時間:
2014-2-9 16:31
谢谢分享
作者:
wlsekffo123
時間:
2014-3-26 16:27
哈哈 学习了~！！！！
作者:
Yenifer
時間:
2016-1-30 22:07
话说似乎以前有一段css可以直接把边栏放左边？
作者:
mcxhcn
時間:
2016-11-19 21:58
多谢，正需要
作者:
郑爽中文网
時間:
2019-2-7 15:50
非常好的教学，必须顶一个
歡迎光臨 SCLUB免費論壇申請-使用者論壇 (http://www.sclub.com.tw/discuz/)
Powered by Discuz! 7.2
新浪微博
QQ空间
人人网
腾讯微博
Facebook
Google+
Plurk
Twitter
Line