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

来源：互联网发布：linux创建svn版本库编辑：程序博客网时间：2024/06/05 00:43

搞了快一个小时，IE7显示下一切正常，但是在FF下，就会显示表格线。
表格是GridView 自动生成的代码，除了设置自定义样式外，没有添加任何样式。

附代码：

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

<Columns>
3

<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源代码：

<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

</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

</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

<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

<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