您的位置：首页 > 其它

常用的网页布局方法单侧固定另一侧适应充满

2014-04-23 16:34 381 查看

<!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=utf-8" /> 
<title>无标题文档</title> 
<style type="text/css"> 
body 
{ 
margin:0; 
padding:0; 
word-wrap:break-word; 
background-color:#CCC; 
} 
.main 
{ 
margin:0px 50px 0px 50px; 
min-height:600px; 
} 

.left_nav 
{ 
float:left; 
position:absolute; 
margin-left:0px; 
width:300px; 
background-color:#F96; 
min-height:600px; 
} 
.right_zone 
{ 
margin:0px 0px 0px 300px; 
min-height:600px; 
background-color:#69C; 
} 
.main_2 
{ 
margin:0px; 
width:100%; 
min-height:600px; 
background-color:#C60; 
} 
</style> 
</head> 
<body> 
<div class="main"> 
<div class="left_nav">ddd 

</div> 
<div class="right_zone"> 
<div class="main_2"> 
<iframe width="100%" height="600" frameborder="0" src="frame_child.html" ></iframe> 
</div> 
</div> 
</div> 
</body> 
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航