您的位置:首页 > 其它

FireFox下GridView表格线显示、隐藏的问题

2011-04-21 13:30 309 查看
搞了快一个小时,IE7显示下一切正常,但是在FF下,就会显示表格线。

表格是GridView 自动生成的代码,除了设置自定义样式外,没有添加任何样式。

附代码:

1



<
asp:GridView
ID
="gvUserList"
runat
="server"
Width
="100%"
AllowPaging
="true"
PageSize
="10"
OnPageIndexChanging
="gvUserList_PageIndexChanging"
GridLines
="None"
>

2



<
Columns
>

3



4



<
asp:BoundField
HeaderText
="用户名"
DataField
="UserName"

>

5



<
ItemStyle
Width
="90px"

/>

6



</
asp:BoundField
>

7



<
asp:BoundField
HeaderText
="电子邮箱"
DataField
="Email"

>

8



<
ItemStyle
Width
="100px"

/>

9



</
asp:BoundField
>

10



<
asp:BoundField
HeaderText
="锁定状态"
DataField
="IsLocked"

>

11



<
ItemStyle
Width
="60px"

/>

12



</
asp:BoundField
>

13



<
asp:BoundField
HeaderText
="上次登陆时间"
DataField
="LastLoginDate"

>

14



<
ItemStyle
Width
="120px"

/>

15



</
asp:BoundField
>

16



<
asp:BoundField
HeaderText
="注册时间"
DataField
="AddDate"

>

17



<
ItemStyle
Width
="120px"

/>

18



</
asp:BoundField
>

19



<
asp:BoundField
HeaderText
="添加人"
DataField
="Creator"

>

20



<
ItemStyle
Width
="90px"

/>

21



</
asp:BoundField
>

22



<
asp:TemplateField
HeaderText
="操作"
>

23



<
ItemTemplate
>

24



<
asp:LinkButton
ID
="lbtnEdit"
CssClass
="red"
ToolTip
="修改该用户的注册信息"
runat
="server"
CommandArgument
='<%#Eval("UserName")%
>
'

25



OnCommand="lbtnEdit_OnCommand" Text="编辑">
</
asp:LinkButton
>

26



<
asp:LinkButton
ID
="lbtnLock"
CssClass
="red"
ToolTip
="锁定该用户"
runat
="server"
CommandArgument
='<%#Eval("UserName")%
>
'

27



OnCommand="lbtnLock_OnCommand" Text="锁定">
</
asp:LinkButton
>

28



<
asp:LinkButton
ID
="lbtnDelete"
CssClass
="red"
ToolTip
="删除该用户"
runat
="server"
CommandArgument
='<%#Eval("UserName")%
>
'

29



OnCommand="lbtnDelete_OnCommand" Text="删除">
</
asp:LinkButton
>

30



</
ItemTemplate
>

31



<
ItemStyle
Width
="100px"

/>

32



</
asp:TemplateField
>

33



</
Columns
>

34



<
PagerStyle
CssClass
="pager"

/>

35



</
asp:GridView
>

对应的样式在.skn文件中设置,如:



<
asp:GridView
CssClass
="tab"
runat
="server"
RowStyle-CssClass
="row"



AlternatingRowStyle-CssClass
="alterRow"
HeaderStyle-CssClass
="header"
AutoGenerateColumns
="false"
>



</
asp:GridView
>

郁闷的问题也随之产生,下面分别为IE和FireFox下显示图:

IE:



FireFox:



很明显同样的代码在FF下却多了几条线,在追求“和谐社会”的今天,决不能容许这些不合谐的事情出现,

查看HTML源代码:

1



<
table
class
="tab"
cellspacing
="0"
rules
="all"
border
="1"
id
="UserList1_gvUserList"
style
="width:100%;border-collapse:collapse;"
>

2



<
tr
class
="header"
>

3



<
th
scope
="col"
>
用户名
</
th
><
th
scope
="col"
>
电子邮箱
</
th
><
th
scope
="col"
>
锁定状态
</
th
><
th
scope
="col"
>
上次登陆时间
</
th
><
th
scope
="col"
>
注册时间
</
th
><
th
scope
="col"
>
添加人
</
th
><
th
scope
="col"
>
操作
</
th
>

4



5



</
tr
><
tr
class
="row"
>

6



<
td
style
="width:90px;"
>
admin
</
td
><
td
style
="width:100px;"
>
fgyl@21cn.com
</
td
><
td
style
="width:60px;"
>
True
</
td
><
td
style
="width:120px;"
>
2007-6-7 10:48:46
</
td
><
td
style
="width:120px;"
>
2007-5-31 11:57:19
</
td
><
td
style
="width:90px;"
>
superAdmin
</
td
><
td
style
="width:100px;"
>

7



<
a
id
="UserList1_gvUserList_ctl02_lbtnEdit"
title
="修改该用户的注册信息"
class
="red"
href
="javascript:__doPostBack('UserList1$gvUserList$ctl02$lbtnEdit','')"
>
编辑
</
a
>

8



<
a
id
="UserList1_gvUserList_ctl02_lbtnLock"
title
="锁定该用户"
class
="red"
href
="javascript:__doPostBack('UserList1$gvUserList$ctl02$lbtnLock','')"
>
锁定
</
a
>

9



<
a
id
="UserList1_gvUserList_ctl02_lbtnDelete"
title
="删除该用户"
class
="red"
href
="javascript:__doPostBack('UserList1$gvUserList$ctl02$lbtnDelete','')"
>
删除
</
a
>

10



11



</
td
>

12



</
tr
><
tr
class
="alterRow"
>

13



<
td
style
="width:90px;"
>
风中吹过的叶子
</
td
><
td
style
="width:100px;"
>
otherfame@163.com
</
td
><
td
style
="width:60px;"
>
False
</
td
><
td
style
="width:120px;"
>
2007-6-7 11:20:15
</
td
><
td
style
="width:120px;"
>
2007-6-7 11:20:15
</
td
><
td
style
="width:90px;"
>
superAdmin
</
td
><
td
style
="width:100px;"
>

14



<
a
id
="UserList1_gvUserList_ctl03_lbtnEdit"
title
="修改该用户的注册信息"
class
="red"
href
="javascript:__doPostBack('UserList1$gvUserList$ctl03$lbtnEdit','')"
>
编辑
</
a
>

15



<
a
id
="UserList1_gvUserList_ctl03_lbtnLock"
title
="锁定该用户"
class
="red"
href
="javascript:__doPostBack('UserList1$gvUserList$ctl03$lbtnLock','')"
>
锁定
</
a
>

16



17



<
a
id
="UserList1_gvUserList_ctl03_lbtnDelete"
title
="删除该用户"
class
="red"
href
="javascript:__doPostBack('UserList1$gvUserList$ctl03$lbtnDelete','')"
>
删除
</
a
>

18



</
td
>

19



</
tr
><
tr
class
="row"
>

20



<
td
style
="width:90px;"
>
洗不掉的血
</
td
><
td
style
="width:100px;"
>
okgogo@163.com
</
td
><
td
style
="width:60px;"
>
False
</
td
><
td
style
="width:120px;"
>
2007-6-7 11:24:01
</
td
><
td
style
="width:120px;"
>
2007-6-7 11:24:01
</
td
><
td
style
="width:90px;"
>
superAdmin
</
td
><
td
style
="width:100px;"
>

21



<
a
id
="UserList1_gvUserList_ctl04_lbtnEdit"
title
="修改该用户的注册信息"
class
="red"
href
="javascript:__doPostBack('UserList1$gvUserList$ctl04$lbtnEdit','')"
>
编辑
</
a
>

22



23



<
a
id
="UserList1_gvUserList_ctl04_lbtnLock"
title
="锁定该用户"
class
="red"
href
="javascript:__doPostBack('UserList1$gvUserList$ctl04$lbtnLock','')"
>
锁定
</
a
>

24



<
a
id
="UserList1_gvUserList_ctl04_lbtnDelete"
title
="删除该用户"
class
="red"
href
="javascript:__doPostBack('UserList1$gvUserList$ctl04$lbtnDelete','')"
>
删除
</
a
>

25



</
td
>

26



</
tr
>

27



</
table
>

注意上面的“rules='all'
"这个属性,查找Baidu,发现此属性有四个值可以设置“all,none,rows,cols”,分别的显示所有的边线、不显示边线、只显示行线和只
显示列线。找到原因就好办事了,拿它开刀,查找GridView属性,发现其有GridLines属性,默认为“Both”,产生Html后的代码就会增
加rules="all"属性,显示,将其设置为"none",再次查看发现一切正常,而Html代码中rules属性也变成“none”,ok,IE和
FF终于达成一致,外国鸟人做个东西这么

不厚道,不过话又说回来,谁让咱自己人没本事呢。用别人的就别挑了。唉~~~

原文:http://www.cnblogs.com/otherfame/archive/2007/06/20/790143.html
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: