技术头条 - 一个快速在微博传播文章的方式     搜索本站
您现在的位置首页 --> CSS/HTML --> 如何强制限制表格宽度

如何强制限制表格宽度

浏览:2396次  出处信息

网站有个地方由于个别用户写的域名比较长,导致表格被撑的很开这就需要强制限制表格宽度(防止文字对列表的挤开),举个例子如下:

<table>

    <tr>
      <td width="5%" >模版ID</td>
      <td width="10%" >模版组</td>
      <td width="20%"  >短信内容</td>
      <td width="15%" >发送范围</td>
      <td width="8%" >添加人</td>
      <td width="12%" >更新时间</td>
      <td width="8%" >有效期</td>
      <td width="12%" >备注</td>
      <td width="10%" >操作</td>
    </tr>
    <s:iterator value="result" id="beans">
      <tr onClick="ClickEvent(this)" onMouseDown="this.className='tblSubDeepBlue'" onMouseOver="overEvent(this)"  onMouseOut="OutEvent(this)" id="${tempId}">
        <td style="word-break:break-all;text-align:left;">${tempId}</td>
        <td style="word-break:break-all;text-align:left;"  >${smsTemplateGroup.groupName}</td>
        <td style="word-break:break-all;text-align:left;">${smsContent}</td>
        <td style="word-break:break-all;text-align:left;">${sendScope}</td><!--这里的样式是为了强制限制列表宽度,不让文字把列宽挤开, 让上面的width="15%"真正起到作用-->        <td style="word-break:break-all;text-align:left;">${operator}</td>
        <td ><s:date name="updateTime" format="yyyy-MM-dd HH:mm" /></td>
        <td ><s:date name="endTimes" format="yyyy-MM-dd" /></td>
        <td style="word-break:break-all;text-align:left;">${remarks}</td>
        <td><a href="javascript:void(0);" onClick="modify('${tempId}')">修改</a>
         <a href="javascript:void(0);" onClick="doRemove('${tempId}')">删除</a> </td>
      </tr>
    </s:iterator>
    <tr>
      <td colspan="9"><%@include file="/common/simplePager.jsp"%></td>
    </tr>

</table>

QQ技术交流群:445447336,欢迎加入!
扫一扫订阅我的微信号:IT技术博客大学习
<< 前一篇:制作CSS气泡框
© 2009 - 2024 by blogread.cn 微博:@IT技术博客大学习

京ICP备15002552号-1