фиксированных верхние и нижние колонтитулы таблицы с повторителем

У меня есть этот повторитель я хочу показать свиток и фиксированные верхние и нижние колонтитулыфиксированных верхние и нижние колонтитулы таблицы с повторителем

ниже код, который я сделал, чтобы показать в повторителе

<table> 
 
<thead> 
 
    <tr> 
 
    <td>Sr No.</td> 
 
    <td>Firstname</td> 
 
    <td>Middlename</td> 
 
    <td>Lastname</td> 
 
    <td>Salary</td> 
 
    <td>Join Date</td> 
 
    <td>Gender</td> 
 
    <td>DOB</td> 
 
    <td>Designation</td> 
 
    <td>Department</td> 
 
    <td>HR Manager</td> 
 
    <td>Reporting Manager</td> 
 
    </tr> 
 
</thead> 
 
    
 
<tbody> 
 
    <asp:Repeater ID="repEmpList" runat="server"> 
 
    <ItemTemplate> 
 
    <tr> 
 
     <td><%#Container.ItemIndex+1 %></td> 
 
    <td>Firstname</td> 
 
    <td>Middlename</td> 
 
    <td>Lastname</td> 
 
    <td>Join Date</td> 
 
    <td>Gender</td> 
 
    <td>DOB</td> 
 
    <td>Designation</td> 
 
    <td>Department</td> 
 
    <td>HR Manager</td> 
 
    <td>Reporting Manager</td> 
 
    </tr> 
 
    </ItemTemplate> 
 
    </asp:Repeater> 
 
    </tbody> 
 
    <tfoot> 
 
    <tr> 
 
    <td></td> 
 
    <td></td> 
 
    <td></td> 
 
    <td></td> 
 
    <td>0.00</td> 
 
    <td></td> 
 
    <td></td> 
 
    <td></td> 
 
    <td></td> 
 
    <td></td> 
 
    <td></td> 
 
    <td></td> 
 
    </tr> 
 
</tfoot> 
 
</table>

теперь я хочу как прокручивается по горизонтали и по вертикали с фиксированными колонтитулами

Как я могу это сделать?

Пожалуйста, помогите мне

Спасибо заранее

источник

2016-07-09 Ravi Sargam

thead, tbody { display: block; width:500px; padding: 0px; } 
 
td {width:150px;} 
 
th {width:150px;} 
 

 
#thbold { 
 
\t text-align: center; 
 
    color: red; 
 
\t } 
 
td { padding : 0px;} 
 
th { padding : 0px;} 
 
tr { padding : 0px;} 
 
table, td, th { 
 
    border: 2px solid black; 
 
    margin : 0px; 
 
    padding : 0px; 
 
    
 
} \t 
 
tbody { 
 
    height: 100px;  /* Just for the demo   */ 
 
    overflow-y: scroll; /* Trigger vertical scroll */ 
 
    overflow-x: scroll; /* Hide the horizontal scroll */ 
 
\t 
 
\t 
 
}

<html> 
 

 
<body> 
 
<table style="width:300px;"> 
 

 

 
<tbody> 
 
<tr id="thbold"> 
 
    <th>Head 1</th> 
 
    <th>Head 2</th> 
 
    <th>Head 3</th> 
 
    <th>Head 4</th> 
 
    <th>Head 5</th> 
 

 
</tr> 
 
<tr> 
 
    <td>Content 1</td> 
 
    <td>Content 2</td> 
 
    <td>Content 3</td> 
 
    <td>Content 4</td> 
 
    <td>Content 5</td> 
 

 
</tr> 
 
<tr> 
 
    <td>Content 1</td> 
 
    <td>Content 2</td> 
 
    <td>Content 3</td> 
 
    <td>Content 4</td> 
 
    <td>Content 5</td> 
 

 
</tr><tr> 
 
    <td>Content 1</td> 
 
    <td>Content 2</td> 
 
    <td>Content 3</td> 
 
    <td>Content 4</td> 
 
    <td>Content 5</td> 
 

 
</tr><tr> 
 
    <td>Content 1</td> 
 
    <td>Content 2</td> 
 
    <td>Content 3</td> 
 
    <td>Content 4</td> 
 
    <td>Content 5</td> 
 
</tr> 
 
</tbody> 
 
</table> 
 

 
</body> 
 

 
</html>

это очень быстро делается код, хотя это, кажется, для удовлетворения ваших потребностей. не стесняйтесь изменять и стилизовать его в соответствии с вашими потребностями. Не забудьте установить thead и tbody как тип отображения для блокировки и ограничить высоту и ширину блока, установить переполнение-x, переполнение-y для прокрутки. Пожалуйста, не стесняйтесь спрашивать о дальнейших разъяснениях

источник

2016-07-09 11:58:09

** @ Vipin Mohan R Nair ** извините, сэр, я не понимаю ваш код с моей ситуацией, если возможно, отправьте ответ, включая мой код и формат –

, вам нужен стол с горизонтальными и вертикальная прокрутка вправо? @RaviSargam –

** @ Vipin Mohan R Nair ** ya, но с фиксированным (freeze) заголовком и нижним колонтитулом также .. –

фиксированных верхние и нижние колонтитулы таблицы с повторителем

ответ

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