<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="https://www.jb51.net/jquery/jquery-1.7b2.js" type="text/javascript"></script>
<style type="text/css">
/*具体模块放在这个大div里*/#contentmenu1 { width: 100%; clear: both; height: 800px; }
/*具体模块div 由上下两块div构成 上面的div又左面 右边 三块拼成圆角图片 下面div主要放置内容 *//*具体模块div*/.content { width: 30%; height: 190px; float: left; margin-left: 2%; margin-top: 10px; }
/*具体模块div上部分*/.content-top { width: 100.5%; height: 24px; float: left; }
/*具体模块div上部分左*/.content-top-left { width: 1%; height: 24px; float: left; background-image: url(images/module_head_bg_left.png); background-position: left; }
/*具体模块div上部分右*/.content-top-right { width: 99%; height: 24px; background-image: url(images/module_head_bg_right.png); float: left; background-position: right; }
/*具体模块div下部分*/.content-bottom { width: 100%; height: 150px; float: left; border: solid 1px #83ACCF; }
/*第二块div*/#contentmenu2 { width: 100%; border: solid 1px; height: 800px; float: left; display: none; }
/*第三块div*/#contentmenu3 { width: 100%; border: solid 1px; height: 800px; float: left; display: none; }
/*第四块div*/#contentmenu4 { width: 100%; border: solid 1px; height: 800px; float: left; display: none; }
</style>
<script type="text/javascript">
function changeBody(index) {
$(".ContentMenu").hide();
$("#contentmenu" + index).show(500);
}
</script>
</head>
<body>
<div>
<div>
<ul>
<li>计划的执行</li>
<li>战略资源 </li>
<li>项目地图 </li>
<li>项目分析 </li>
</ul>
</div>
<!--第一块内容div-->
<div>
<div>
<div>
<div>
</div>
<div>
</div>
</div>
<div>
</div>
</div>
<div>
<div>
<div>
</div>
<div>
</div>
</div>
<div>
</div>
</div>
</div>
<!--第二块内容div-->
<div>
<div>
<div>
<div>
</div>
<div>
</div>
</div>
<div>
</div>
</div>
<div>
<div>
<div>
</div>
<div>
</div>
</div>
<div>
</div>
</div>
</div>
<!--第三块内容div-->
<div>
第三块
</div>
<!--第四块内容div-->
<div>
第四块
</div>
</div>
</body>
</html>
您可能感兴趣的文章: