账号通
    

账号  

密码  

2274

查看

4

回复
主题:DIV+CSS构建网站教程(四) [收藏主题] 转到:  
高山流水 当前离线

730

主题

0

广播

2

粉丝
添加关注
级别:六年级

用户积分:3985 分
登录次数:627 次
注册时间:2006/11/3
最后登录:2024/3/1
高山流水 发表于:2006/12/2 14:19:00   | 只看该作者 查看该作者主题 楼主 
科汛在线商城系统(NET)

下面来学习容器崁套使用,制作出以下的显示效果。

此主题相关图片如下:

1、先根据效果来画一个设计图解,这可是做事的根据哟。
 
此主题相关图片如下:

2、进入网站后台,如果退出来了就点网站黄色容器下面的“管理登录”,我预先在网站模板中插入了这个登录后台的标签。
在模板中主体替换如下的内容:
<div id="main">
<div id="main_left">
<div id="z_box1">热门新闻</div>
<div id="z_box1">推荐新闻</div>
</div>
<div id="main_right">
<div id="r_box1">新闻动态</div>
<div id="r_box1">办事指南</div>
</div>
</div>
<div id="bot">{$GetManageLogin}</div>

3、保存模板,发布首页。
4、编辑/images中style.css文件,添加以下容器的设置样式。
#main
{
margin-top:10px;
margin-left:10px;
width:600px;
background:#ff0;
}
#main_left
{
float:left;
width:200px;
}
#main_right
{
float:right;
width:396px;
}
#z_box1
{
height:100px;
background:#f6f6f6;
margin-bottom:4px;
padding:10px;
border:#ccc 1px solid
}
#r_box1
{
height:100px;
background:#f6f6f6;
margin-bottom:4px;
padding:10px;
border:#ccc 1px solid
}

保存CSS文件,刷新网站前台看效果。其实,在制作过程中可以边编写边保存看网站变化的效果,不断地改变参数看网站变化的效果。如果达不到自己想要的效果,要么检查模板中的容器调用是否正确,要么是CSS文件的参数设置有问题。


(待续)

[此贴子已经被作者于2006-12-2 14:22:03编辑过]

 
  支持(0) | 反对(0) 回到顶部顶端 回到底部底部
天涯社区 当前离线

160

主题

0

广播

0

粉丝
添加关注
级别:一年级

用户积分:3874 分
登录次数:87 次
注册时间:2006/7/25
最后登录:2008/12/29
天涯社区 发表于:2006/12/4 9:20:00   | 只看该作者 查看该作者主题 沙发 
 
  支持(0) | 反对(0) 回到顶部顶端 回到底部底部
force0117 当前离线

138

主题

0

广播

0

粉丝
添加关注
级别:一年级

用户积分:978 分
登录次数:122 次
注册时间:2006/10/16
最后登录:2014/4/8
force0117 发表于:2006/12/4 9:13:00   | 只看该作者 查看该作者主题 藤椅 
科汛在线商城系统(NET)
多谢多谢 lz的学习帖子都是我需要的 呵
 
  支持(0) | 反对(0) 回到顶部顶端 回到底部底部
lxlwpf 当前离线

90

主题

0

广播

0

粉丝
添加关注
级别:学前班

用户积分:83 分
登录次数:12 次
注册时间:2012/4/13
最后登录:2014/12/16
lxlwpf 发表于:2014/7/18 10:49:26   | 只看该作者 查看该作者主题 板凳 
科汛智能建站系统
谢谢分享,楼主好人,为了积分,见贴就回!谢谢分享,楼主好人,为了积分,见贴就回!谢谢分享,楼主好人,为了积分,见贴就回!谢谢分享,楼主好人,为了积分,见贴就回!谢谢分享,楼主好人,为了积分,见贴就回!谢谢分享,楼主好人,为了积分,见贴就回!谢谢分享,楼主好人,为了积分,见贴就回!谢谢分享,楼主好人,为了积分,见贴就回!
 
  支持(0) | 反对(0) 回到顶部顶端 回到底部底部
lxlwpf 当前离线

90

主题

0

广播

0

粉丝
添加关注
级别:学前班

用户积分:83 分
登录次数:12 次
注册时间:2012/4/13
最后登录:2014/12/16
lxlwpf 发表于:2014/7/18 10:59:03   | 只看该作者 查看该作者主题 报纸 
谢谢分享,楼主好人,为了积分,见贴就回!谢谢分享,楼主好人,为了积分,见贴就回!谢谢分享,楼主好人,为了积分,见贴就回!谢谢分享,楼主好人,为了积分,见贴就回!谢谢分享,楼主好人,为了积分,见贴就回!谢谢分享,楼主好人,为了积分,见贴就回!谢谢分享,楼主好人,为了积分,见贴就回!谢谢分享,楼主好人,为了积分,见贴就回!
 
  支持(0) | 反对(0) 回到顶部顶端 回到底部底部
<上一主题 | 下一主题 >
Powered By KesionCMS Version X1
厦门科汛软件有限公司 © 2006-2016 页面执行0.10938秒 powered by KesionCMS 9.0