css – div中带滚动条的表格

前端之家收集整理的这篇文章主要介绍了css – div中带滚动条的表格前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
是否可以将表放在可滚动的div中?我尝试过,但随后显示更多的行和列更大的表,扭曲其他div,我的意思是在可滚动的div中显示其他div来自lower.

谢谢,
最好的祝福

解决方法

HTML
<div class="table-wrapper">
    <table>
        <tr>
            <td>A</td>
            <td>B</td>
            <td>C</td>
            <td>D</td>
        </tr>
        <tr>
            <td>A</td>
            <td>B</td>
            <td>C</td>
            <td>D</td>
        </tr>
        <tr>
            <td>A</td>
            <td>B</td>
            <td>C</td>
            <td>D</td>
        </tr>
        <tr>
            <td>A</td>
            <td>B</td>
            <td>C</td>
            <td>D</td>
        </tr>
    </table>      
</div>

CSS

.table-wrapper
{
    border: 1px solid red;
    width: 100px;
    height: 50px;
    overflow: auto;
}

table
{
    border: 1px solid black;
    margin-right: 20px;
}

td
{
    width: 20px;
    height: 20px;
    background-color: #ccc;
}

的jsfiddle

http://jsfiddle.net/gvee/v54Sz/

原文链接:https://www.f2er.com/css/215307.html

猜你在找的CSS相关文章