您的位置:首页 > 其它

毕业设计(二十三)---空间大致布局 简画

2015-09-19 00:00 525 查看


左侧为个人资料 的小的导航, [具体各项还没有需改]

点击分别在右侧显示内容

个人空间主页的时候 默认在中间区域显示好友动态或者全站动态

<div id="wai" >

<div id='ad2' >
<a href="${zonead_link }" target='_blank'><img src="<%=basePath%>${zonead_picAdd }" width="950" height="100" border="0" /></a>
</div>

<div id="gerenziliao" >
<span style="font-size:20px" >${user.zonetitle }</span>
<div id="touxiang" >
<s:if test="#session.user.headImage!=null">
<img src="<%=basePath %>${ user.headImage}" width="120px" height="120px"  />
</s:if>
<s:else>
<img src="<%=basePath%>public/image/morentouxiang.png" width="120px" height="120px"  />
</s:else><br/>
<a href="javascript:void(0);" onclick="tanchuChangeHeadImage();" >更换头像</a>
<a href="myzone!xiugaiziliaoPre.action"  >修改资料</a>
</div>

<ul id="nav2">
<li><a href="#">home</a>
</li>
<li><a href="#">about</a>
</li>
<li><a href="#">news</a>
</li>
<li><a href="#">products</a>
</li>
<li><a href="#">services</a>
</li>
<li><a href="#">clients</a>
</li>
<li><a href="#">blog</a>
</li>
</ul>

</div>
<div id="mk" >
<div id="haoyoudongtai" >sdfdsfddddddddddddd</div>
<div id="wodeguanzhu" ></div>
</div>
</div>


#wai {
position: relative;
margin : 0px auto;
width: 950px;
}
#ad2{
position: relative;
margin: 0px auto;
top: 27px;
width: auto;
height: 100px;
border: 1px solid red;
}
#mk{
position: absolute;
left: 180px;
top:135px;
width: 770px;
border: 1px solid black;
text-align: center;

}

#gerenziliao{
top: 135px;
position: absolute;
border: 1px solid blue;
width:180px;
height:450px;
background-color: #EBF1F4;
}
#mk #haoyoudongtai{
position: absolute;
border: 1px solid blue;
left: 0px;
width:520px;
height:900px;
}

#mk #wodeguanzhu{
position: absolute;
border: 1px solid blue;
left:520px;
width:250px;
height:450px;
}


版权声明:本文为博主原创文章,未经博主允许不得转载。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: