当前位置:编程学习 > html/css >>

div 添加滚动条

style="overflow: hidden; width: 100px; white-space: nowrap; text-overflow: ellipsis" //让所有的table td都展开
 
overflow-y: hidden; overflow-x: scroll; width: 987px  //设置竖着没有滚动条,横着有滚动条 ,一定要设置宽度
例子:
<div style="overflow-y: hidden; overflow-x: scroll; width: 987px">
        <table class="report-list" style="width: 970px" cellspacing="0" cellpadding="0" align="center" border="2" bind="on">
            <tbody>
                <tr>
                    <td class="itemClick1" align="center" width="30">
                        序号
                    </td>
                    <td class="itemClick1-5" align="center" width="100" req="SORT,创建日期" con="CLICK">
                        创建日期
                    </td>
                    <td class="itemClick1-5" align="center" width="100" req="SORT,质量问题名称" con="CLICK">
                        质量问题名称
                    </td>
                    <td class="itemClick1-5" align="center" width="100" req="SORT,最终产品名称" con="CLICK">
                        最终产品名称
                    </td>
                    <td class="itemClick1-5" align="center" width="100" req="SORT,工作状态" con="CLICK">
                        工作状态
                    </td>
                    <td class="itemClick1-5" align="center" width="100" req="SORT,一层原因" con="CLICK">
                        一层原因
                    </td>
                    <td class="itemClick1-5" align="center" width="100" req="SORT,技术归零" con="CLICK">
                        技术归零
                    </td>
                    <td class="itemClick1-5" align="center" width="100" req="SORT,管理归零" con="CLICK">
                        管理归零
                    </td>
                    <td class="itemClick1-5" align="center" width="40" req="SORT,原件查看" con="CLICK">
                        原件查看
                    </td>
                    <td class="itemClick1-5" style="width: 40px; text-align: center">
                        <div style="overflow: hidden; width: 40px; white-space: nowrap; text-overflow: ellipsis">
                            删除</div>
                    </td>
                    <td class="itemClick1-5" style="width: 40px; text-align: center">
                        <div style="overflow: hidden; width: 40px; white-space: nowrap; text-overflow: ellipsis">
                            修改</div>
                    </td>
                    <td class="itemClick1-5" style="border-bottom-color: #79d8f0; width: 60px; text-align: center">
                        <div style="overflow: hidden; width: 60px; white-space: nowrap; text-overflow: ellipsis">
                            工作流</div>
                    </td>
                    <td>
                        备注
                    </td>
                    <td>
                        多数
                    </td>
                </tr>
                <tr class="reportTR" req="REPORT,b0cfeedbe63c48a99d3b324acc5bb619,02,a2f004335b1c4a4398706ce32b5aca6f,4,admin,,,," con="CLICK">
                    <td class="item1" align="center">
                        <div class="overflow1" title="1">
                            1</div>
                    </td>
                    <td class="item1-6" align="center" width="100">
                        <div title="2013-01-30 14:05:12" style="overfl
补充:web前端 , HTML/CSS  ,
CopyRight © 2022 站长资源库 编程知识问答 zzzyk.com All Rights Reserved
部分文章来自网络,