акрепляйте в HTML таблице

мне нужно заморозить первую строку на таблицу ниже, вот мой текущий код ниже Пожалуйста, дай мне знать, если вам нужно больше информацииакрепляйте в HTML таблице

Вот изображение таблицы:

<head> 
<style> 
    table,td,th 
    {border-collapse:collapse;} 
    table.myTable td, table.myTable th { border:1px solid black;padding:5px; 
    font-family:Verdana, Arial, Helvetica, sans-serif; 
    color:#2C3539; 
    font-size:0.80em} 

    table 
    {width:100%;} 
    th{background-color:#B6B6B4; 
    height:10px;} 
</style> 

<table class="myTable"> 
<?php 
//MySQL Database Connect 
include 'connect.php'; 
echo " 
<tr> 
<th>Name</th> 
<th>Location</th> 
<th>Email</th> 
<th>Mobile</th> 
<th>IMEI</th> 
<th>Phone</th> 
<th>Message</th> 
</tr></Freezing>"; 

while($row = mysqli_fetch_array($result)) 

    { 
    echo "<tr>"; 
    echo "<td>" . $row['Name'] . "</td>"; 
    echo "<td>" . $row['Location'] . "</td>"; 
    echo "<td>" . $row['Email'] . "</td>"; 
    echo "<td>" . $row['Mobile'] . "</td>"; 
    echo "<td>" . $row['IMEI'] . "</td>"; 
    echo "<td>" . $row['Phone'] . "</td>"; 
    echo "<td>" . $row['Message'] . "</td>"; 
    echo "</tr>"; 
    } 
echo "</table>"; 

mysqli_close($con); 
?>

источник

2013-09-05 Billo

* «Мне нужно, чтобы заморозить первую строку на таблице ниже» * - Вы собираетесь должны остановиться на этом. –

http://i.stack.imgur.com/NzJKZ.png - это изображение покажет таблицу, серый фон будет строкой, которую мне нужно заморозить, если это имеет смысл – Billo

Я видел изображение, я просто не знаю, я понимаю, чего вы пытаетесь достичь. –

Вместо этого вы можете использовать <thead> для сегментации своих <th> тегов. Затем вы можете использовать либо абсолютное фиксированное позиционирование, чтобы этот раздел плавал над другими. Вот пример:

HTML

<thead> 
    <tr> 
     <th>Name</th> 
     <th>Location</th> 
     <th>Email</th> 
     <th>Mobile</th> 
     <th>IMEI</th> 
     <th>Phone</th> 
     <th>Message</th> 
    </tr> 
</thead> 
<tbody> 
... 
</tbody>

CSS

thead { 
    display: block; 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100% 
    z-index: 100; 
}

Вам также может понадобиться добавить некоторое дополнение к верхней части <tbody> тега, так что закрепленная строка делает не сидеть поверх любых данных. Кроме того, абсолютное позиционирование будет относиться к ближайшему расположенному предку, поэтому вам может потребоваться добавить позицию в таблицу.

table { 
    position: relative; 
} 
tbody { 
    padding-top: 1em; 
}

источник

2013-09-05 14:41:58

Я вижу, что происходит, но не делает этого. http://i.imgur.com/bXdm0O2.png также он по-прежнему перемещается – Billo

Может быть, попробуйте 'display: table-row' вместо блока отображения? –

@Billo Затем вам нужно установить свои ячейки на фиксированный размер ширины для всех. –

попробовать это это с помощью JQuery, хотя Freeze Header

источник

2013-09-05 15:14:31

акрепляйте в HTML таблице

ответ

Смежные вопросы