zoukankan      html  css  js  c++  java
  • FireFox下GridView表格线显示、隐藏的问题

    以下是转载:

    搞了快一个小时,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="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="90px;">admin</td><td style="100px;">fgyl@21cn.com</td><td style="60px;">True</td><td style="120px;">2007-6-7 10:48:46</td><td style="120px;">2007-5-31 11:57:19</td><td style="90px;">superAdmin</td><td style="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="90px;">风中吹过的叶子</td><td style="100px;">otherfame@163.com</td><td style="60px;">False</td><td style="120px;">2007-6-7 11:20:15</td><td style="120px;">2007-6-7 11:20:15</td><td style="90px;">superAdmin</td><td style="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="90px;">洗不掉的血</td><td style="100px;">okgogo@163.com</td><td style="60px;">False</td><td style="120px;">2007-6-7 11:24:01</td><td style="120px;">2007-6-7 11:24:01</td><td style="90px;">superAdmin</td><td style="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终于达成一致,外国鸟人做个东西这么
    不厚道,不过话又说回来,谁让咱自己人没本事呢。用别人的就别挑了。唉~~~

    本文来自CSDN博客,转载请标明出处:http://blog.csdn.net/skyaspnet/archive/2008/07/26/2714129.aspx

          我在做新闻发布系统中也出现了这个问题,而且Firefox和IE一样都不显示网格线。css+div+直接窗体属性调试,试着调了好久也没有调试成功。以下是它们顽固的显示状况:

    Friefox(就比IE多了一个外边框(⊙o⊙)…)

    clip_image001

    IE(对外边框的设置都不识别%>_<%)

    clip_image002

         问题搁置,以后解决。。。好再不是什么大问题,不影响整个系统的进行。。。

  • 相关阅读:
    第三章 读书笔记
    第一章 读书笔记
    第二章 读书笔记
    第九章
    第十章
    第8章 蜂鸣器
    第7章 led闪烁
    第6章 第一个Linux驱动程序:统计单词个数
    第5章 搭建S3C6410开发板环境
    第3章 Git使用入门
  • 原文地址:https://www.cnblogs.com/CharmingDang/p/9664006.html
Copyright © 2011-2022 走看看