仓酷云

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 638|回复: 8
打印 上一主题 下一主题

[DIV+CSS] 来谈谈:不必float完成模块居中结构

[复制链接]
深爱那片海 该用户已被删除
跳转到指定楼层
楼主
发表于 2015-1-16 00:21:13 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
你用什么用的熟练就用什么,讲究的是效率,客户永远不管你用什么,页面就要好看,功能就要好用,还有时间和成本的问题。
最多见有用的结构情势:上、中左、中右、底四个模块,宽度760px,全体页面居中。

布局代码,topleftrightfoot四个模块全体自力、互不嵌套。
<divid="top">head</div>

<divid="left">
<divid="left_module">left</div>
</div>

<divid="right">
<divid="right_module">right</div>
</div>

<divid="foot">foot</div>
顶部属于惯例界说。
#top{height:100px;background:#ccc;width:760px;margin:auto;text-align:center;}
办法A:外层left界说为760px宽并居中;内层left_module界说为实践的左边宽度280px,且相对定位,top值即是顶部界说的高度。
这类办法的优点是:leftright两个模块代码片段能够交换调剂显现优先级。
#left{width:760px;margin:auto;}
#left_module{width:280px;position:absolute;top:100px;padding:10px;}
办法B:外层left界说为760px宽并居中,绝对浮动于top;内层left_module界说为实践的左边宽度280px,且相对定位。
这类办法的优点是:顶部的高度能够自在延长。
#left{width:760px;margin:auto;position:relative;}
#left_module{width:280px;position:absolute;padding:10px;}
外层right界说为760px宽并居中,内层right_module界说为实践的右边宽度440px,利用margin语法居左。right_module界说的背景致是实践右边的背景致,界说的高度就是实践两头模块的高度;right的背景致就是实践左边的背景致。
#right{width:760px;margin:auto;background:#E8E8E8;}
#right_module{width:440px;background:#F0F0F0;height:360px;margin:000auto;padding:10px;}
底部也属于惯例界说。
#foot{height:100px;background:#ccc;width:760px;margin:auto;text-align:center;}
测试情况IE6.0和FF1.5,都是最俗的语法,十分复杂,有用无限,可做手艺参考。
</p>
对相应的代码做一些简单的修改,就可以改变同一页面的不同部分,或者页数不同的网页的外观和格式。
admin 该用户已被删除
沙发
发表于 2015-1-18 06:13:31 | 只看该作者
还可以在Dreamweaver常用工具中选择超级链接,完成相应的填写即可。
山那边是海 该用户已被删除
板凳
发表于 2015-1-25 13:45:17 | 只看该作者
我深感到交流的重要。善于交流的人才是善于学习的人。在整个技术的学习过程中,我总结了四大定律:兴趣、恒心、虚心、时间。
不帅 该用户已被删除
地板
发表于 2015-2-2 22:20:18 | 只看该作者
所见则所得网页编辑器的优点就是直观性,使用方便,容易上手.
小魔女 该用户已被删除
5#
发表于 2015-2-8 15:04:31 | 只看该作者
足见市场的反响和MACROMEDIA公司对它们的自信。说到Dreamweaver8我们应该了解一下网页编辑器的发展过程,随着互联网(Internet) 的家喻户晓。
6#
发表于 2015-2-25 20:08:37 | 只看该作者
所见则所得网页编辑器的优点就是直观性,使用方便,容易上手.
海妖 该用户已被删除
7#
发表于 2015-3-8 04:46:07 | 只看该作者
Adobe Dreamweaver(前称Macromedia Dreamweaver)是Adobe公司的著名网站开发工具。
若天明 该用户已被删除
8#
发表于 2015-3-15 22:05:44 | 只看该作者
由CS4 版本开始,则转用WebKit 排版引擎(亦即Google Chrome和Apple Safari浏览器所用的排版引擎)作为网页预览。
第二个灵魂 该用户已被删除
9#
发表于 2015-3-22 16:57:07 | 只看该作者
帧(frames)和表格的制作速度快的令您无法想像。进阶表格编辑功能使您简单的选择单格、行、栏或作未连续之选取。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|仓酷云 鄂ICP备14007578号-2

GMT+8, 2024-5-10 21:17

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表