溫馨提示×

asp.net 分頁樣式怎樣調整

小樊
105
2024-12-09 20:58:27
欄目: 編程語言

在ASP.NET中,分頁樣式可以通過以下幾種方法進行調整:

  1. 使用內置的分頁控件樣式:

ASP.NET提供了內置的分頁控件樣式,你可以通過修改這些樣式來調整分頁控件的樣式。在Web.config文件中,找到<system.web>部分,設置<pages>元素的theme屬性,例如:

<configuration>
  <system.web>
    <pages theme="Default" />
  </system.web>
</configuration>

然后,你可以在CSS文件中重寫內置樣式的屬性,例如:

/* 重寫分頁控件的背景顏色 */
.aspNetPager .pageButton {
  background-color: #f0f0f0;
}

/* 重寫分頁控件的選擇背景顏色 */
.aspNetPager .pageButtonSelected {
  background-color: #007acc;
}
  1. 自定義分頁樣式:

如果你需要更多的自定義選項,可以創建自定義分頁控件。以下是一個簡單的自定義分頁控件示例:

首先,創建一個新的ASP.NET Web項目,然后在Default.aspx文件中添加以下代碼:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>自定義分頁控件示例</title>
    <style type="text/css">
        .customPager {
            font-family: Arial, sans-serif;
            font-size: 14px;
        }

        .customPager a {
            text-decoration: none;
            color: #000;
            background-color: #fff;
            border: 1px solid #ccc;
            padding: 4px 8px;
            margin: 2px;
        }

        .customPager a:hover {
            background-color: #007acc;
            color: #fff;
        }

        .customPager .pageInfo {
            font-weight: bold;
            color: #333;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
        <div class="customPager">
            <asp:Label ID="lblPageInfo" runat="server" Text="頁碼: 1" CssClass="pageInfo"></asp:Label>
            <asp:Repeater ID="rptPages" runat="server">
                <ItemTemplate>
                    <a href='<%# "?page=" + Eval("Value") %>'><%# Eval("Text") %></a>
                </ItemTemplate>
                <FooterTemplate>
                    <asp:Label ID="lblLastPage" runat="server" Text="共 %d 頁" CssClass="pageInfo"></asp:Label>
                </FooterTemplate>
            </asp:Repeater>
        </div>
    </form>
</body>
</html>

接下來,在Default.aspx.cs文件中添加以下代碼:

using System;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            BindPages();
        }
    }

    private void BindPages()
    {
        int totalPages = 10; // 總頁數
        int currentPage = 1; // 當前頁碼
        rptPages.DataSource = GeneratePageNumbers(currentPage, totalPages);
        rptPages.DataBind();
    }

    private static object[] GeneratePageNumbers(int currentPage, int totalPages)
    {
        var pages = new List<object>();

        for (int i = 1; i <= totalPages; i++)
        {
            pages.Add(new { Text = i.ToString(), Value = i });
        }

        return pages.ToArray();
    }
}

這個示例中,我們創建了一個自定義的分頁控件,包含當前頁碼、總頁數和頁碼鏈接。你可以根據需要修改CSS樣式以調整分頁控件的樣式。

0
亚洲午夜精品一区二区_中文无码日韩欧免_久久香蕉精品视频_欧美主播一区二区三区美女