适合CRM、ERP可以用到的框架布局,高度宽度都做到了自适应。右侧的iframe也是高度自适应 。调整了不同浏览器那几个px的差异,多种浏览器表现一模一样。只是使用的标准的简单的CSS代码,代码简单但是还是比较细致的。基本没有用到CSS hack。初学者,高手都只得一看。
我知道,一般程序员,都比较烦这个,不屑于做这个东西。如果觉得有用拿去用吧,如果觉得没用。仍几块砖给我。
</style>
</head>
<body>
<form id="form1">
<div id="divAll">
<div id="top">
<h3>Logo</h3>
</div>
<div id="middle">
<div id="left">
left<br />
left<br />
left<br />
left<br />
left<br />导航
left<br />导航
left<br />导航导航
left<br />导航
left<br />导航导航
left<br />
left<br />
left<br />
left<br />
left<br />
left<br />
left<br />
left<br />
left<br />
left<br />
left<br />
</div>
<div id="right">
<iframe src="http://www.cnblogs.com" frameborder="0"
marginheight="0" id="main" name="main"></iframe>
</div>
</div>
<div id="bottom">
版权信息
</div>
</div>
</form>
</body>
补:看到很多朋友提出疑问,说即用了绝对定位,有用了浮动。那是经过调了几次发现只有这样才能显示正常。如果你使用IE8浏览器,则注释和注释之间的部分都是可以省去的。对于CSS我其实也是门外汉,以上代码都是经过尝试做出的。能用就是王道。有些朋友说IE6下iframe会出现问题。这真是一个值得在修改尝试的问题,因为企业里用IE6的也不在少数。所以了解原理在加上实践才是最可行的。
在实际的应用中如果要做到精致,很难不用js再对样式做出调整,总之解决问题才是最重要的王道,其次是代码简洁。而技巧,我们也只能当它是技巧。
补:另一件郁闷的事,博客园的这个“HTML 原始程序代码编辑器”在我把代码贴进去后自动生成了两套样式,不知是什么原因。已改正。