DIV+CSS网页另类上下布局的实例代码

ttx9n · 发表于 2008-10-10 01:02:59

在论坛里看到一位朋友在问一个上下2个内容框的，宽度为100%的布局方式，然后自己也就尝试了一下，发现了几个问题的存在先说说在尝试的过程发现的几个问题
1、盒模型问题
相信玩重构或者说是DIV+CSS的朋友应该都知道这个东西，废话不多说，不知道而有兴趣可以去网上搜索一下。这里我提到这个是因为这个布局是用百分比来控制的，所以当加对边框加上1px的边后，就不好减回来，我是舍弃了上边的边框样式。

2、溢出问题
这个问题只要对overflow做hidden就可以了，防止内容过长而溢出。刚刚开始的时候可以对html跟body的overflow加一个hidden属性。Blank 告诉我，IE默认是有滚动条的宽度（这个偶知道），而FF是没有的（这个偶就不知道了）。

基本上也就这样，代码如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>上下层测试</title> 
<style type="text/css"> 
 
</style> 
</head> 
<body> 
 
<h3>上面的</h3> 
 
 
 
 
 
 
 
 
 
 
 
<h3>下面的</h3> 
 
</body> 
</html> 
</body> 
</html>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

123456 · 发表于 2022-12-3 08:57:18

哦哦哦ijhhsdj

a75620618 · 发表于 2023-9-1 18:58:32

谢谢楼主分享

.l4 · 发表于 2023-9-10 14:58:24

撒房产税陈飞飞

qq303604905 · 发表于 2023-9-16 15:20:34

还有什么好东西没

回复用户1 · 发表于 2023-10-14 01:59:42

强烈支持楼主ing……

rveqwdpw5 · 发表于 2023-10-21 05:44:10

天天源码论坛

btbhs8t · 发表于 2023-11-19 01:53:41

论坛有你更精彩！

u6h2m4 · 发表于 2024-3-5 05:20:35

激动人心，无法言表！

dm00ji1s · 发表于 2024-3-16 07:44:57

飞飞飞飞飞飞飞飞飞飞飞飞飞

账号		自动登录	找回密码
密码			立即注册

[CSS/HTML] DIV+CSS网页另类上下布局的实例代码

相关帖子