如何更改 4 边网格视图以显示角半径?

问题描述 投票:0回答:1

我在

asp.net web forms
工作。我遇到问题,我无法更改网格视图的标题以在 4 个边上取角半径。

所以我需要获取标题样式并将其作为 CSS 样式或引导到网格视图以获得 4 边的角边半径 左上-右上-左下-右下

确切地说我需要在每一边都得到相同的角

网格视图组件如下:

<asp:GridView ID="GridViewSearchData" runat="server" AutoGenerateColumns="false" DataKeyNames="ID" CssClass="table"  HeaderStyle-BackColor="#172b4d"   AllowPaging="true" OnPageIndexChanging="grdData_PageIndexChanging" PageSize="10">
    <Columns>
    <asp:TemplateField HeaderText="Select All" ItemStyle-HorizontalAlign="Center">
    <asp:BoundField DataField="BranchCode" HeaderText="BranchCode" HeaderStyle-ForeColor="White" />
    <asp:BoundField DataField="Status" HeaderText="Status" HeaderStyle-ForeColor="White"  />
    <asp:BoundField DataField="OrderNo" HeaderText="OrderNo" ItemStyle-Width="120px" HeaderStyle-ForeColor="White"  />
    <asp:BoundField DataField="OrderType" HeaderText="OrderType" HeaderStyle-ForeColor="White"  />
    <asp:BoundField DataField="Printer_name" HeaderText="Printer_name" HeaderStyle-ForeColor="White"  />
    <asp:BoundField DataField="EntredDatetime" HeaderText="EntredDatetime" HeaderStyle-ForeColor="White"  />                            
    <asp:BoundField DataField="Id" HeaderText="Id" ItemStyle-CssClass="hidden"  HeaderStyle-CssClass="hidden"  />
       
    </Columns>
</asp:GridView>

预期结果如下:

jquery css asp.net bootstrap-4 gridview
1个回答
0
投票

我通过以下步骤解决了我的问题:

1- 我添加如下 CSS 类:

.corners { border: 0px solid blue; -moz-border-radius: 8px; border-radius: 8px;overflow: hidden;-webkit-border-radius: 8px;}

2- 添加包含网格视图的 div

3- 通过 CSS 将类分配给包含网格视图的 div,如下所示:

 <div class="corners">
 <asp:GridView ID="GridViewSearchData" runat="server" AutoGenerateColumns="false" DataKeyNames="ID" CssClass="table"  HeaderStyle-BackColor="#172b4d" HeaderStyle-CssClass="header"   AllowPaging="true" OnPageIndexChanging="grdData_PageIndexChanging" PageSize="10" >                           
</asp:GridView>
</div>

它工作

© www.soinside.com 2019 - 2024. All rights reserved.