Heim  >  Artikel  >  Web-Frontend  >  css中td样式_html/css_WEB-ITnose

css中td样式_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 12:16:511183Durchsuche


要求:将下图中新增行的线条对齐

目前做出的效果图:
[img=http://t2.qpic.cn/mblogpic/67ee2fa0e025de5fd5b8/2000][/img]
请高手指点
这是代码:

<!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></head><script type="text/javascript" src="/TemplateFile/htmllayout/js/ld.js"></script><style>.tables{	border-color:#616161; border-width:1px; border-style:solid;	}.tds{	border:#999; border-width:1px 1px 1px 1px; border-style:solid;	}	.tdsts{	border:#999; border-width:1px 1px 1px 1px; border-style:solid;    background-color:#eff6ff;	}.mingxiTable {	width:98%;	background-color:#fff;}.mingxiTable, .mingxiTable td {	border-spacing:0;	border-collapse:collapse;	border:1px #c0c0c0 solid;}.mingxitd {	background-color:#fff;	text-align:center;	height:28px;	padding:0;}.mingxitd table, .mingxitd td {	background-color:#FFF;	border-spacing:0;	border-collapse:collapse;	border-left:0;	border-top:0;	border-right:0;	border-bottom:0;}.mingxitd .detailAddTd {	background-color:#FFF;	text-align:left;	height:28px;	border-bottom:#c0c0c0 solid 1px;}.mingxitd .inputstyle {	margin-left:5px;}.mingxitd .field {	background-color:#FFF;	text-align:left;	height:28px;	border-top:#c0c0c0 solid 1px;}.mingxitd .header td {	text-align:left;	border-top:#c0c0c0 solid 1px;	text-align:left;	height:28px;}.mingxitdC1 {}.fujian table, .fujian td {	border:0;	text-align:left;	height:28px;}input{ border:0px none;}</style><body>    <div align="center">    <!--2行一列的表格里嵌套了一个20行13列的表格-->    <table width="90%" height="439" border="0" style="font-family:'宋体'; font-size:12px;">      <tr>        <td height="26" align="center" style="font-family:'宋体'; font-size:22px; FONT-WEIGHT: bold;">岗位工资制月度考核平衡记分卡</td>      </tr>      <tr>        <td><table width="100%" border="0" cellspacing="1" cellpadding="2" class="tables">          <tr>            <td class="tds" width="4%">被考核人</td>            <td colspan="2" class="tds"> </td>            <td class="tds" width="6%">部门</td>            <td colspan="4" class="tds"> </td>            <td width="6%" class="tds">考核周期</td>            <td colspan="4" class="tds"> </td>          </tr>          <tr>            <td class="tdsts" width="4%">类型</td>            <td colspan="12" align="center" class="tdsts"><b>A财务类10%</b></td>          </tr>          <tr>            <td colspan="11" > </td>            <td width="12%" ><div id="div0button"><button class="BtnFlow" id="$addbutton0$" accesskey="A" name="addbutton0" onclick="addRow0(0)"><u>A</u>-添加</button></div></td>            <td width="28%" ><div><button class="BtnFlow" id="$delbutton0$" accesskey="E" name="delbutton0" onclick="if(isdel()){deleteRow0(0);}"><u>E</u>-删除</button></div></td>          </tr>          <tr>            <td colspan="13">             <table class="mingxiTable" width="100%">             <tr>                <td class="tds" width="4%">序号</td>            <td width="4%" class="tds">具体指标</td>            <td width="5%"    class="tds">权重</td>            <td    class="tds">指标说明</td>            <td width="6%"    class="tds">基本目标</td>            <td width="6%"    class="tds">最高目标</td>            <td width="7%"    class="tds">基本权分</td>            <td width="6%"    class="tds">最高权分</td>            <td    class="tds">计分方法</td>            <td width="5%"    class="tds">数据来源</td>            <td width="5%"    class="tds">完成情况</td>            <td    class="tds">评分</td>            <td    class="tds">支持文件</td>          </tr>          <tr>            <td width="4%"  > </td>            <td class="mingxitd"   > </td>            <td class="mingxitd"   > </td>            <td class="mingxitd"   > </td>            <td class="mingxitd"   > </td>            <td class="mingxitd"   > </td>            <td class="mingxitd"  > </td>            <td class="mingxitd"   > </td>            <td class="mingxitd"   > </td>            <td class="mingxitd"   > </td>            <td class="mingxitd"   > </td>            <td class="mingxitd"   > </td>            <td class="mingxitd"  > </td>             </tr>             </table>            </td>          </tr>          <tr>            <td class="tdsts"   >类型</td>            <td colspan="12" align="center" class="tdsts"><b>B类内部营运类70</b>%</td>          </tr>          <tr>            <td colspan="11" > </td>            <td width="12%" ><div id="div0button2"><button class="BtnFlow" id="$addbutton2$" accesskey="A" name="addbutton2" onclick="addRow2(2)"><u>A</u>-添加</button></div></td>            <td width="28%" ><div><button class="BtnFlow" id="$delbutton2$" accesskey="E" name="delbutton2" onclick="if(isdel()){deleteRow2(2);}"><u>E</u>-删除</button></div></td>          </tr>          <tr>          <td colspan="13" >            <table class="mingxiTable" width="100%">            <tr>                <td class="tds">序号</td>                <td class="tds">具体指标</td>                <td class="tds">权重</td>                <td class="tds">指标说明</td>                <td class="tds">基本目标</td>                <td class="tds">最高目标</td>                <td class="tds">基本权分</td>                <td class="tds">最高权分</td>                <td class="tds">计分方法</td>                <td class="tds">数据来源</td>                <td class="tds">完成情况</td>                <td class="tds">评分</td>                <td class="tds">支持文件</td>              </tr>              <tr>                <td> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>            </tr>            </table>            </td>          </tr>          <tr>            <td class="tdsts">类型</td>            <td colspan="12" align="center" class="tdsts"><b>C客户类10%</b></td>          </tr>          <tr>            <td colspan="11" > </td>            <td width="12%" ><div id="div0button3"><button class="BtnFlow" id="$addbutton3$" accesskey="A" name="addbutton3" onclick="addRow3(3)"><u>A</u>-添加</button></div></td>            <td width="28%" ><div><button class="BtnFlow" id="$delbutton3$" accesskey="E" name="delbutton3" onclick="if(isdel()){deleteRow3(3);}"><u>E</u>-删除</button></div></td>          </tr>          <tr>            <td colspan="13">             <table class="mingxiTable" width="100%">              <tr>                <td class="tds">序号</td>                <td class="tds">具体指标</td>                <td class="tds">权重</td>                <td class="tds">指标说明</td>                <td class="tds">基本目标</td>                <td class="tds">最高目标</td>                <td class="tds">基本权分</td>                <td class="tds">最高权分</td>                <td class="tds">计分方法</td>                <td class="tds">数据来源</td>                <td class="tds">完成情况</td>                <td class="tds">评分</td>                <td class="tds">支持文件</td>              </tr>              <tr>                <td> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>                <td class="mingxitd"> </td>              </tr>             </table>            </td>          </tr>          <tr>            <td class="tdsts">类型</td>            <td colspan="12" align="center" class="tdsts"><b>D创新成长类10</b>%</td>          </tr>    </div></body></html>


回复讨论(解决方案)

图片:
[img=http://t2.qpic.cn/mblogpic/67ee2fa0e025de5fd5b8/2000][/img]

建议如果对于每个td的格式相同的话,还是把格式放在其父元素tr中的好

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn