cakephp:具有固定标头的Bootstrap可滚动表不起作用

时间:2018-07-10 14:12:35

标签: css

我在Cakephp应用程序上工作。在索引视图中,我想修复表头。我看到了这个question并尝试使用它,但在我的情况下却不起作用。

<?= $this->Paginator->paginator() ?>
    <table class="hoverTable dataTable">
        <thead>
            <tr>
                <th><?= $this->Paginator->sort('id') ?></th>
                <th><?= $this->Paginator->sort('name') ?></th>
                <th><?= $this->Paginator->sort('erial_number') ?></th>
                <th class="actions"><?= __('Actions') ?></th>
            </tr>
        </thead>
        <tbody>
            <?php foreach ($assets as $asset): ?>
            <tr>
                <td><?= $asset->id ?></td>
                ....
                <td class="actions">
                    <?= $this->Html->iconButton('glyphicon-eye-open', __(''), [
                        'controller' => 'Assets',
                        'action' => 'view', $asset['id']])
                    ?>
                    ....
                </td>       
            </tr>
            <?php endforeach; ?>
        </tbody>
    </table>

在我的CSS中,我有:

    .hoverTable{
        border-collapse: collapse;
        margin: 12px 0 0 0;
        width: 100%;
    }        
    .hoverTable th {
        padding: .6em 1em;
        background: #d0f0e9;
        font-weight: bold;
        border:#edfdf9 1px solid;
    }
    .hoverTable td{
        padding-bottom: 12px;
    }

    }
    .hoverTable tr:hover {
        background-color: #eff6f5;
    }

我试图将其添加到我的CSS中,但是没有用:

    .hoverTable thead
    {
        display: block;
        overflow: auto;
    }

    .hoverTable tbody
    {
        display: block;
        height: 200px;
        overflow: auto;
    }

请帮忙吗?

0 个答案:

没有答案