div实现帖子的推荐、置顶、精华
效果:
样式:
<style type="text/css">.tj_div{ display: block; position:absolute; left:16%; top:28%; margin-left: auto; margin-right: auto; width: 150px; height: 90px; background-image:url(images/state/atj.gif);/*推荐*/ z-index:-2;/*下拉列表的z-index是10,所以这两个样式中的z-index必须小于10*/ -moz-opacity: 0.9; opacity:.90; filter: alpha(opacity=90);}.jh_div{ display: block; position:absolute; left:56%; top:18%; margin-left: auto; margin-right: auto; width: 150px; height: 90px; background-image:url(images/state/ajh.gif);/*精华*/ z-index:-2;/*下拉列表的z-index是10,所以这两个样式中的z-index必须小于10*/ -moz-opacity: 0.9; opacity:.90; filter: alpha(opacity=90);}.zd_div{ display: block; position:absolute; left:35%; top:5%; margin-left: auto; margin-right: auto; width: 150px; height: 90px; background-image:url(images/state/azd.gif);/*置顶*/ z-index:-2;/*下拉列表的z-index是10,所以这两个样式中的z-index必须小于10*/ -moz-opacity: 0.9; opacity:.90; filter: alpha(opacity=90);}.content_div{ display: block; position:relative; left:0; top:0; margin-left: auto; margin-right: auto; width: 100%; height: auto; z-index:0;}</style>
<td align="left" ><div style="position:relative"><!-- state==1,是普通主题,开始 --><c:if test="${topicBean.to.state==1 }"><div style="margin-top: 0px;">${topicBean.to.content }<br><br><br><!-- 顶踩开始 --><div id="digg" style=" margin-left: auto;margin-right: auto;"></div><!-- 顶踩结束--><!-- 管理员置顶 --> <c:if test="${topicBean.to.isATop==1}"><div title="投票" alt="div兑现帖子的推荐、置顶、精华"/>投票:<font style="font-weight: bold;">${topicBean.tv.voteTitle }</font></p><c:if test="${not empty topicBean.tv.voteDescribe}"><p>${topicBean.tv.voteDescribe}</p></c:if><div id="optionDiv" style="margin-left: auto;margin-right: auto;"></div><div id="optionDivEd" style="margin-left: auto;margin-right: auto;"></div></c:if><!-- state==2,是投票,结束 --></div></td>