日期:2014-05-17 浏览次数:20649 次
效果:
分析:
?上面Layer7...是一个定义了高度的div,下面是一个两行的table,主要东西都在第一行中,第二行定义了一个高度,是为了和下方结果之间有一个空隙。
1、
2、
3、
table的第一行如蓝色的线部分,两列,其左侧空白即红色的线部分,主体部分在第二个td中:
4、
?
5、
?
右侧td里面定义了一个一行一列的table,并设置背景图片
??? ?????????????????? 在单元格中定义一个div,设定padding-left
?????????????????????? div中又定义了一个width是90%的table,这才是内容的主体部分
?
6、绿线是div部分,右侧蓝线是90%的table部分
这个主体table部分代码:
<div id="searchInfo" style="padding-left: 20px;"> <table style="width:90%;" border="0"> <tr height="30px"> <td colspan="5"> <span style="color: #808080;font-weight: bold;"> Select a mark-up Area </span> </td> </tr>
?最后的按钮class:
<input type="button" class="button_search" onclick="doQuery();" value="Search"/>?
.button_search { width: 150px;height:23px;border: 1px solid #8DB3E2;background:#5D5DFF;text-align:center;text-decoration:none;font-size:13px;color: #FFF;font-weight: bold; }
?背景图片:
...