GridView樣式設定 豎線及橫線

2021-09-30 10:01:41 字數 1424 閱讀 4794

gridview在生成html**的時候會自動加上style="border-collapse:collapse;"以及border=1,rules="all"這些屬性,

這些在ie下都沒什麼影響,但是在ff下就會影響顯示,style="border-collapse:collapse;";是由於設定了cellspacing="0"產生的,當設定

cellspacing="1"後就沒有,可以去掉style="border-collapse:collapse;";預設情況下cellspacing="0",所以預設情況下會有style="border-collapse:collapse;"這個屬性生成。gridlines="both"會帶來border=1,rules=all這兩個屬性,

設定gridlines="none"後border=0,rules屬性則不會出現。

ms預設的gridview生成html**的方式本身就沒有去相容各種瀏覽器,只是特別照顧了自己的ie,其實ms已經給出了解決辦法,那就是自己定義控制項如何生成html**,css 控制項介面卡工具包新版發布

介紹如何配置自己的瀏覽器定義檔案。詳細的可以參考msdn:瀏覽器定義檔案架構(browsers 元素)

如何設定gridview讓它在ie和ff下都能正常顯示呢?下面會進行說明。

1.單元格都有邊框線,效果如下:

說明:gridlines="all",cellspacing="0"是造成ff和ie下顯示不同的乙個很大的原因;其實不進行設定border也是可以達到單元格表現出邊框的樣式。cellspacing="1"就控制了單元格之間的間隔是1px,通過設定table的背景和tr的背景來表現出單元格td的border,實際上td的border為0,這個看起來很像的border是table的背景,tr的背景僅僅是改變了td的背景,td之間的space則是根據table的背景顯示的,這就是cellspacing="1"帶來的border效果。這樣在ie和ff下都能正常顯示了。

2.只有橫線,沒有豎線的效果:

gridview樣式如下設定:需要借助額外的css,gridview自帶的類似樣式不相容ff

3.只有豎線的效果:

更改上面的即可。

更改table樣式為:

table

.table th

.table td

可以實現第一種的顯示效果,這才是真的border

至此,gridview的樣式設定告一段落了。上面的設定方法在ie6.0,ff2.0下測試通過。

GridView樣式設定

gridview在生成html 的時候會自動加上style border collapse collapse 以及border 1,rules all 這些屬性,這些在ie下都沒什麼影響,但是在ff下就會影響顯示,style border collapse collapse 是由於設定了cellsp...

GridView樣式設定

gridview樣式設定 gridview在生成html 的時候會自動加上style border collapse collapse 以及border 1,rules all 這些屬性,這些在ie下都沒什麼影響,但是在ff下就會影響顯示,style border collapse collapse...

GridView用CSS設定樣式

gridview是很便利的資料控制項,在mis中的應用很廣泛,其樣式編寫很簡單,但是每次新增都要重新編寫,工作很是煩瑣,而且由於其本身的特性,樣式並不好編寫,最好的辦法就是在單雙行 header pager footer等欄目引用單獨的樣式,如下 抱歉,暫時沒有資料!各樣式如下 gridview 樣...