GridView固定ヘッダと先頭列
GridViewに表示されるデータが非常に多い場合、ユーザーは、スクロールバーをドラッグすると、各列または行の内容が明確に理解されるように、開発者がヘッダーまたは最初の列を固定する必要があります.CSSの機能を利用してGridViewをこのような表にすることができます.
まず、GridViewをコンテナに配置し、次のCSSをページに追加します.
最後にGridViewのHeaderStyleプロパティセットのCssClassプロパティをfixedheaderに設定します.
左の列を固定する方法については、これと同様の
まず、GridViewを
.fixedheader
{
position:relative ;
table-layout:fixed;
top:expression(this.offsetParent.scrollTop -1);
z-index: 10;
}
.fixedheader th{text-overflow:ellipsis;overflow:hidden;white-space: nowrap;}最後にGridViewのHeaderStyleプロパティセットのCssClassプロパティをfixedheaderに設定します.
<HeaderStyle Wrap="False" CssClass="fixedheader" />左の列を固定する方法については、これと同様の
.fixedLeft
{
position: relative;
left:expression (this.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.scrollLeft-4);
z-index:10;
} <HeaderStyle CssClass="fixed" />
.fixed
{
background-color:White;
position: relative ;
top:expression(this.offsetParent.scrollTop);
left:expression(this.offsetParent.scrollLeft);
z-index:2;
}