杰表技术论坛 's Archiver

admin 发表于 2015-12-21 11:47

在控件中如何定义单元格,不让内容超宽的单元格撑开单元格?

如下所示:[code]<table style="table-layout:fixed;width:490px" id="break-table" headerRows='1' everyFooter='myEveryFooter' lastFooter='myLastFooter'>
                                <thead>
                                        <tr>
                                                <td width="20">序号</td>
                                                <td width="100">商品名称</td>
                                                <td width="50">数量</td>
                                                <td width="50">赠品</td>
                                                <td width="50">单位</td>
                                                <td width="50">规格</td>
                                                <td width="50">单价</td>
                                                <td width="150">金额</td>
                                                <td width="50">备注</td>
                                       
                                       
                                        </tr>
                                </thead>
                                <tbody>
                                        <tr>
                                                <td width="20">1</td>
                                                <td width="100" style='white-space:nowrap;overflow:hidden;'>123213213213213213213213213213213213213133</td>
                                                <td width="50">30</td>
                                                <td width="50">0</td>
                                                <td width="50">箱</td>
                                                <td width="50">1kg</td>
                                                <td width="50">180.00</td>
                                                <td width="50"><span>501801800.0</span></td>
                                                <td width="50">正常价</td>
                                        </tr>
                               
                               
                               
                                <tbody id='myEveryFooter'>
                                        <tr>
                                                  <td colspan="5">页合计:{decimal(pageSum(7),2)}</td>
                                    <td colspan="7">共合计:{rmb(decimal(sum(7),2))}</td>
                                        </tr>
                                </tbody>
                                <tbody id='myLastFooter'>
                                        <tr>
                                                <td colspan="9">制单员:张三</td>
                                        </tr>
                                </tbody>
                               
                        </table>[/code]

admin 发表于 2015-12-21 11:50

如上所示,需要设置两个部分:
1. 设置 <table> 的  style="table-layout:fixed;width:490px"    ,注意需要设置 table-layout为fixed和显式指定表格宽度
2. 设定单元格 style='white-space:nowrap;overflow:hidden;'
3. 在第一行,显式指定各列宽度

页: [1]

Powered by Discuz! Archiver 6.1.0  © 2001-2007 Comsenz Inc.