HTML/CSS：如何为tr创建滚动条_Html_Css

HTML/CSS：如何为tr创建滚动条

html css

HTML/CSS：如何为tr创建滚动条,html,css,Html,Css,有人能告诉我如何为内表创建滚动条吗？内部表格不显示在容器内。我把容器的背景涂成黄色。桌子本身是蓝色的我想在桌子里看到一个滚动条资料来源：在这里： <html> <body> <div style="width:1000px;margin-left:auto;margin-right:auto;background-color: yellow; height: 1000px;"> <table style="background-color

有人能告诉我如何为内表创建滚动条吗？内部表格不显示在容器内。我把容器的背景涂成黄色。桌子本身是蓝色的

我想在桌子里看到一个滚动条

资料来源：

在这里：

<html>
<body>
<div style="width:1000px;margin-left:auto;margin-right:auto;background-color: yellow; height: 1000px;">
    <table style="background-color: blue">
        <tr>
            <th>column1</th>
            <th>column2</th>
            <th>column3</th>
            <th>column4</th>
        </tr>
        <tr>
            <td>columnvalue1</td>
            <td>columnvalue2</td>
            <td>columnvalue3</td>
            <td>columnvalue4</td>
        </tr>
        <tr>
            <td colspan="4">
                <table>
                    <tr>
                        <th>SubColumn1</th>
                        <th>SubColumn2</th>
                        <th>SubColumn3</th>
                        <th>SubColumn4</th>
                        <th>SubColumn5</th>
                        <th>SubColumn6</th>
                        <th>SubColumn7</th>
                        <th>SubColumn8</th>
                        <th>SubColumn9</th>
                        <th>SubColumn10</th>
                        <th>SubColumn11</th>
                        <th>SubColumn12</th>
                        <th>SubColumn13</th>
                        <th>SubColumn14</th>
                    </tr>
                    <tr>
                        <td>subvalue1</td>
                        <td>subvalue2</td>
                        <td>subvalue3</td>
                        <td>subvalue4</td>
                        <td>subvalue5</td>
                        <td>subvalue6</td>
                        <td>subvalue7</td>
                        <td>subvalue8</td>
                        <td>subvalue9</td>
                        <td>subvalue10</td>
                        <td>subvalue11</td>
                        <td>subvalue12</td>
                        <td>subvalue13</td>
                        <td>subvalue14</td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
</div>
<body>
</html>


专栏1
专栏2
第3栏
专栏4
列值1
列值2
列值3
列值4
亚列1
亚柱2
亚柱3
亚柱4
亚柱5
亚柱6
亚柱7
亚柱8
亚柱9
亚柱10
亚柱11
亚柱12
亚柱13
亚柱14
子值1
子值2
子值3
子值4
子值5
子值6
子值7
子值8
子值9
子值10
子值11
子值12
子值13
子价值14

在div部件上试试这个

<div style="overflow:scroll width:1000px;margin-left:auto;margin-right:auto;
background-color: yellow; height: 1000px;">

如果失败，请尝试溢出：在表格的样式上滚动。

用div包装您的内部表格。通过将溢出设置为自动或滚动的宽度和高度样式，使该div可滚动

<div style="width:1000px;margin-left:auto;margin-right:auto;background-color: yellow; height: 1000px;">
<table style="background-color: blue">
    <tr>
        <th>column1</th>
        <th>column2</th>
        <th>column3</th>
        <th>column4</th>
    </tr>
    <tr>
        <td>columnvalue1</td>
        <td>columnvalue2</td>
        <td>columnvalue3</td>
        <td>columnvalue4</td>
    </tr>
    <tr>
        <td colspan="4">
            <div style="max-height: 100px; max-width: 100px; width: 100px; overflow: auto;">
            <table>
                <tr>
                    <th>SubColumn1</th>
                    <th>SubColumn2</th>
                    <th>SubColumn3</th>
                    <th>SubColumn4</th>
                    <th>SubColumn5</th>
                    <th>SubColumn6</th>
                    <th>SubColumn7</th>
                    <th>SubColumn8</th>
                    <th>SubColumn9</th>
                    <th>SubColumn10</th>
                    <th>SubColumn11</th>
                    <th>SubColumn12</th>
                    <th>SubColumn13</th>
                    <th>SubColumn14</th>
                </tr>
                <tr>
                    <td>subvalue1</td>
                    <td>subvalue2</td>
                    <td>subvalue3</td>
                    <td>subvalue4</td>
                    <td>subvalue5</td>
                    <td>subvalue6</td>
                    <td>subvalue7</td>
                    <td>subvalue8</td>
                    <td>subvalue9</td>
                    <td>subvalue10</td>
                    <td>subvalue11</td>
                    <td>subvalue12</td>
                    <td>subvalue13</td>
                    <td>subvalue14</td>
                </tr>
            </table>
            </div>
        </td>
    </tr>
</table>


专栏1
专栏2
第3栏
专栏4
列值1
列值2
列值3
列值4
亚列1
亚柱2
亚柱3
亚柱4
亚柱5
亚柱6
亚柱7
亚柱8
亚柱9
亚柱10
亚柱11
亚柱12
亚柱13
亚柱14
子值1
子值2
子值3
子值4
子值5
子值6
子值7
子值8
子值9
子值10
子值11
子值12
子值13
子价值14

这应该可以

用div将您的表包装起来，div与您的

容器

和

溢出：滚动

示例：

哪个部分是“内桌？”使用find:D lol:D我也要看两遍…亲爱的，你在过去三天里想这么做吗我看到你的回答是@Kyle Sevenoaks在那里工作。。这里也差不多！！抱歉重复，我已经将我的帖子标记为删除。是的，你的最后一篇帖子是我想做的，但没有给出宽度。有可能吗？是的，你可以删除width，max width，max height，取而代之的是溢出：滚动，但是在某个时候你会觉得有必要定义width和height。试试看：）哇。。我不知道jsbin的事。。。这很酷：）谢谢：）我知道jsfiddle.net，但jsbin对我来说是新的：）谢谢你的启发：）