Question

我使用的是Bootstrap 3，并且在iFrame或任何内容中存在表格问题。我希望将iFrame内容视为页面的一部分我已经删除了iFrame边框，只是为了清楚。

因此，例如，如果iFrame的宽度为1000像素，则内容页面宽度也应为1000px @ 100％。

我正在使用Bootstrap 3。

enter image description here

正如您在示例中所看到的，iFrame有一个滚动条，因为它认为其页面大小为1920宽度。

<?php if(login_check($mysqli)==true): ?>
<body>
<div class="row-fluid">
    <div class="col-md-4">
        <h3>Clients</h3>
    </div>
    <div class="col-md-8">
        <select>
            <option value="name">First Name</option>
            <option value="surname">Surname</option>
            <option value="company">Company</option>
            <option value="date">Date</option>
        </select> 
    </div>
    <div class="col-md-12">
        <table id ="example" class="table table-striped table-bordered">
            <thead>
                <tr>
                    <th>Account</th>
                    <th>Name</th>
                    <th>Surname</th>
                    <th>Phone</th>
                    <th>Unit</th>
                    <th>Street</th>
                    <th>type</th>
                    <th>Suburb</th>
                    <th>Date</th>
                </tr>
            </thead>
            <tbody>
            <?php
            $clients_list = "SELECT * FROM clients_table";
            $details = $mysqli->query($clients_list);
            while($row = mysqli_fetch_array($details))  {
                echo '
                    <tr>
                        <td><input type="text" value="'.$row['_account'].'" id="_account'.$row['_account'].'" readonly="readonly"/></td>
                        <td><input type="text" value="'.$row['_first'].' " id="_first'.$row['_id'].'"/></td>
                        <td><input type="text" value="'.$row['_surname'].'"id="_surname'.$row['_id'].'"/></td>
                        <td><input type="text" value="'.$row['_phone'].'"id="_phone'.$row['_id'].'"/></td>
                        <td><input type="text" value="'.$row['_unit'].'" id="_unit'.$row['_id'].'"/></td>
                        <td><input type="text" value="'.$row['_street'].'" id="_street'.$row['_id'].'"/></td>
                        <td><input type="text" value="'.$row['_type'].'" id="_type'.$row['_id'].'"/></td>
                        <td><input type="text" value="'.$row['_suburb'].'"id="_suburb'.$row['_id'].'"/></td>
                        <td><input type="text" value="'.$row['_email'].'"id="_email'.$row['_id'].'"/></td>  
                    </tr>';
            }
            ?>          
            </tbody>
        </table>                                                        
    </div>
</div>

Answer 1

这是bootstrap.css中的代码

请试试。

.table-responsive {
  min-height: .01%;
  overflow-x: auto;
}
@media screen and (max-width: 767px) {
  .table-responsive {
    width: 100%;
    margin-bottom: 15px;
    overflow-y: hidden;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    border: 1px solid #ddd;       
  }

Answer 2

据我所知，iframe中加载的页面是否有响应，那么您将完全没有问题。

所以，如果你设置身高＆amp;宽度为100％然后它将完全“适合”iframe，使其看起来像您的主要网页的一部分。

Bootstrap 3：iFrame

2 个答案: