标签:style blog color ar sp 数据 div on log
#t1{ table-layout:fixed; } #t1 td{ text-overflow:ellipsis; overflow:hidden; white-space: nowrap; }
上面是css
1 <table width="670" align="center" border="0" cellpadding="0" cellspacing="0" class="tyouhyou_11pt" id="t1"> 2 <tr height="30" class="tyouhyou_8pt" bgcolor="LightCyan"> 3 <td align="center" width="120" bgcolor="#BBFFFF" style="border: 1px solid black;">顧客名</td> 4 <td align="center" width="70" bgcolor="#BBFFFF" style="border: 1px solid black;border-left: 0px;">対象年月</td> 5 <td align="center" width="80" bgcolor="#BBFFFF" style="border: 1px solid black;border-left: 0px;">派遣社員名カナ</td> 6 <td align="center" width="60" bgcolor="#BBFFFF" style="border: 1px solid black;border-left: 0px;">スタッフCD</td> 7 <td align="center" width="100" bgcolor="#BBFFFF" style="border: 1px solid black;border-left: 0px;">発行依頼日時</td> 8 <td align="center" width="100" bgcolor="#BBFFFF" style="border: 1px solid black;border-left: 0px;">発行日時</td> 9 10 <td align="center" width="120" bgcolor="#BBFFFF" style="border: 1px solid black;border-left: 0px;">送付先メールアドレス</td> 11 12 <td align="center" width="20" bgcolor="#BBFFFF" style="border: 1px solid black;border-left: 0px;"> </td> 13 </tr> 14 15 <s:iterator id="hakenkeiyakuConfirmVo.dataList" value="hakenkeiyakuConfirmVo.dataList"> 16 <tr height="30" class="tyouhyou_8pt" > 17 <td align="left" width="140" style="border-left: 1px solid black;border-bottom: 1px solid black; 18 border-right: 1px solid black;" title="<s:property value="confirm_ko_name" />"> 19 <s:property value="confirm_ko_name" /> 20 </td> 21 <td align="center" width="70" style="border-left: 0px;border-bottom: 1px solid black; 22 border-right: 1px solid black;"> 23 <s:property value="confirm_year_month" /> 24 </td> 25 <td align="center" width="80" style="border-left: 0px;border-bottom: 1px solid black; 26 border-right: 1px solid black;"> 27 <s:property value="confirm_staff_name"/> 28 </td> 29 <td align="center" width="60" style="border-left: 0px;border-bottom: 1px solid black; 30 border-right: 1px solid black;"> 31 <s:property value="confirm_staff_cd"/> 32 </td> 33 <td align="center" width="100" style="border-left: 0px;border-bottom: 1px solid black; 34 border-right: 1px solid black;"> 35 <s:property value="confirm_order_time"/> 36 </td> 37 <td align="center" width="100" style="border-left: 0px;border-bottom: 1px solid black; 38 border-right: 1px solid black;"> 39 <s:property value="confirm_semd_time"/> 40 </td> 41 42 <td align="center" width="120" style="border-left: 0px;border-bottom: 1px solid black; 43 border-right: 1px solid black;" title="<s:property value="confirm_sendMailAddr"/>"> 44 <s:property value="confirm_sendMailAddr"/> 45 </td> 46 47 <td align="center" width="20" style="border-left: 0px;border-bottom: 1px solid black; 48 border-right: 1px solid black;"> 49 <s:checkbox name="hakenSakiKanri.selectedStaff" id="hakenSakiKanri.selectedStaff" onclick="checkedYesOrNo();"> 50 </s:checkbox> 51 <input type="hidden" name="selectedStaff" id="selectedStaff" value="<s:property value="confirm_staff_cd"/>"/> 52 <input type="hidden" name="selectedKoCds" id="selectedKoCds" value="<s:property value="confirm_ko_cd"/>"/> 53 <input type="hidden" name="selectedYearMonths" id="selectedYms" value="<s:property value="confirm_year_month1"/>"/> 54 <input type="hidden" name="selectedOrderTimes" id="selectedOts" value="<s:property value="confirm_order_time"/>"/> 55 </td> 56 </tr> 57 </s:iterator> 58 </table>
上面红色标记的就是鼠标移上去出现全部数据的那一列,只是多一个title属性
所以综上所述,只需要css和代码中红色标记的就可以实现了
关于table里的数据太长超出列宽时,不换行,出省略号,鼠标移上去以后显示全部数据
标签:style blog color ar sp 数据 div on log
原文地址:http://www.cnblogs.com/tian-chen/p/4037171.html