如何在ASP.NET（C＃）中设置listview的字体大小，族和颜色

So I have the following ListView1

所以我有以下ListView1

[asp.net]

 <asp:ListView ID="ListView1" runat="server" DataSourceID="SqlDataSource1" 
            onprerender="ListView1_PreRender" 
            onselectedindexchanged="ListView1_SelectedIndexChanged">

To which I have tried to set the following properties through CSS

我试图通过CSS设置以下属性

[css]

[CSS]

#ListView1
{
    color: White;
    font-family: Calibri;
}

But that did not work for some reason.

但由于某种原因，这不起作用。

3 个解决方案

#1

runat='server' will change element IDs often times, appending the name of the class of the page. You can do two things to fix the issue:

runat ='server'会经常更改元素ID，附加页面类的名称。您可以做两件事来解决问题：

1) Change the name of the ID selector in CSS to match what the ID is altered to be (which you figure out by doing a view source on the rendered page).

1）更改CSS中ID选择器的名称以匹配ID被更改为的内容（通过在呈现的页面上执行查看源来确定）。

2) Apply a class to the element instead of using the ID.

2）将一个类应用于元素而不是使用ID。

The second one is probably better, as you can reuse that class on other pages without changing any CSS, and it's a bit more straightforward.

第二个可能更好，因为您可以在不更改任何CSS的情况下在其他页面上重用该类，并且它更简单一些。

#2

You could set the ClientIdMode to static to ensure that the ID of the server control doesn't change when it is rendered as html even if it is in a container or a master page.

您可以将ClientIdMode设置为static，以确保服务器控件的ID在呈现为html时不会更改，即使它位于容器或母版页中也是如此。

 <asp:ListView ID="ListView1" runat="server" DataSourceID="SqlDataSource1" 
            onprerender="ListView1_PreRender" 
            onselectedindexchanged="ListView1_SelectedIndexChanged" ClientIdMode="Static">

#3

you can try the CssClass property

你可以尝试CssClass属性

.ListView1
{
    color: White;
    font-family: Calibri;
}

and then use it as

然后用它作为

<asp:ListView ID="ListView1" runat="server" DataSourceID="SqlDataSource1" 
            onprerender="ListView1_PreRender"  CssClass= "ListView1"
            onselectedindexchanged="ListView1_SelectedIndexChanged">

You can style it more better if you use the ItemTemplate / LayoutTemplate as shown here

如果使用此处所示的ItemTemplate / LayoutTemplate，则可以更好地设置样式

#1