引导样式未在 asp.net gridview 中呈现并显示其他类答案

【问题标题】：Bootstrap styles are not rendering in asp.net gridview and showing some other class引导样式未在 asp.net gridview 中呈现并显示其他类
【发布时间】：2020-04-08 14:34:57
【问题描述】：

我正在改造旧的 asp.net Web 应用程序并使其具有响应性。我使用了使用引导程序的 ace-master 模板。我的页面中有一个gridview。我像这样更改了我的gridview代码

<div class="row">
    <div class="col-xs-12">
        <!-- PAGE CONTENT BEGINS -->
        <div>

            <div id="dynamic-table_wrapper" class="dataTables_wrapper form-inline no-footer">

                <asp:GridView ID="dgTradename" runat="server" Width="100%" DataKeyNames="TradeNameId" CssClass="table table-striped table-bordered table-hover dataTable no-footer"
                    AutoGenerateColumns="False" OnRowDataBound="dgTradename_RowDataBound" AlternatingRowStyle-CssClass="even" RowStyle-CssClass="odd"
                    AllowPaging="True" OnPageIndexChanging="dgTradename_PageIndexChanging" OnRowCommand="dgTradename_RowCommand"
                    UseAccessibleHeader="true" GridLines="Both">

                    <Columns>
                        <asp:BoundField DataField="TradeNameNo" HeaderText="Trade Name No" ItemStyle-HorizontalAlign="Left">
                            <ItemStyle HorizontalAlign="Left"></ItemStyle>
                        </asp:BoundField>

                        <asp:TemplateField HeaderText="Owner Name" ItemStyle-HorizontalAlign="Left">
                            <ItemTemplate><%#DataBinder.Eval(Container.DataItem, "dtoOwner.NameEn")%></ItemTemplate>

                            <ItemStyle HorizontalAlign="Left"></ItemStyle>
                        </asp:TemplateField>


                    </Columns>
                </asp:GridView>
            </div>


        </div>
        <!-- PAGE CONTENT ENDS -->
    </div>
</div>

但在渲染代码时，表格的 html 代码显示 css 类“GridView”，并且未渲染所需的引导 css

<div class="row">
    <div class="col-xs-12">
        <!-- PAGE CONTENT BEGINS -->
        <div>

            <div id="dynamic-table_wrapper" class="dataTables_wrapper form-inline no-footer">


                <div>
    <table class="GridView" id="ctl00_PageBody_ctlSearchTradeName1_dgTradename" style="border-style:None;width:100%;border-collapse:collapse;" cellspacing="0" border="0">
        <thead>
            <tr class="Header">
                <th scope="col">Trade Name No</th><th scope="col">Owner Name</th>
            </tr>
        </thead><tbody>
            <tr class="Row">
                <td align="left">114</td><td align="left">Honj</td>
            </tr><tr class="AlternatingRow">
                <td align="left">909</td><td align="left"> Internet Cafe Tr</td>
            </tr><tr class="Pager">
                <td colspan="6"><table border="0">
                    <tbody><tr>
                        <td><span class="editBox" style="display:inline-block;border-style:Solid;width:200px;">1</span></td><td><a href="javascript:__doPostBack('ctl00$PageBody$ctlSearchTradeName1$dgTradename','Page$2')">2</a></td><td><a href="javascript:__doPostBack('ctl00$PageBody$ctlSearchTradeName1$dgTradename','Page$3')">3</a></td><td><a href="javascript:__doPostBack('ctl00$PageBody$ctlSearchTradeName1$dgTradename','Page$4')">4</a></td><td><a href="javascript:__doPostBack('ctl00$PageBody$ctlSearchTradeName1$dgTradename','Page$5')">5</a></td><td><a href="javascript:__doPostBack('ctl00$PageBody$ctlSearchTradeName1$dgTradename','Page$6')">6</a></td><td><a href="javascript:__doPostBack('ctl00$PageBody$ctlSearchTradeName1$dgTradename','Page$7')">7</a></td><td><a href="javascript:__doPostBack('ctl00$PageBody$ctlSearchTradeName1$dgTradename','Page$8')">8</a></td><td><a href="javascript:__doPostBack('ctl00$PageBody$ctlSearchTradeName1$dgTradename','Page$9')">9</a></td>
                    </tr>
                </tbody></table></td>
            </tr>
        </tbody>
    </table>
</div>
            </div>


        </div>
        <!-- PAGE CONTENT ENDS -->
    </div>
</div>

我试过了

从应用程序中删除所有其他 css 类
从浏览器中删除所有缓存
清理并重建解决方案

请不要将此视为重复的问题，因为我已经尝试了来自不同 stackoverflow 问题的所有答案

【问题讨论】：

从您设置CssClass="table table-striped table-bordered table-hover dataTable no-footer" 并获得其他内容的那一刻起，您就可以在代码中的某处对该css 进行内部更改。随便搜一下
我有一个旧的 css，其中包含这种 'Gridview' 样式。我从解决方案中完全删除了该文件。
现在我在 Page_Load 中添加了一个 css 替换代码。那行得通。但这不是一个合适的解决方案
好吧，从它的外观来看并不完整 - 出于某种原因，仍然有一些东西会改变它。也许如果你关闭 IIS 和 VS，并删除 asp.net 的临时文件
当然我会尝试然后回来......

标签： html css asp.net bootstrap-4

【解决方案1】：

花了一个星期后，我发现了问题。

我的解决方案中添加了一些皮肤。即使它没有在任何地方提及，它也是从后面使用的。我从我的解决方案中删除了这些皮肤，现在渲染了引导样式

【讨论】：