ASP.NET MVC中PagedListPager无样式问题求助

Hey Miguel, let's get that plain-looking pagination sorted out right away—here are the straightforward steps to restore proper styling:

1. Make sure the PagedList CSS is referenced #

The PagedList.Mvc NuGet package includes a default CSS file that styles the pager, but you need to explicitly include it in your project:

• If you're using a shared layout (like _Layout.cshtml), add this line inside the <head> section:

  @Styles.Render("~/Content/PagedList.css")
  

• Alternatively, add a direct link tag in your CarrosList.cshtml view's <head>:

  <link href="~/Content/PagedList.css" rel="stylesheet" type="text/css" />
  

2. Attach the default style class to your PagedListPager #

Even with the CSS loaded, you need to tell the pager to use the styled class. Update your PagedListPager call to include the HtmlAttributes parameter:

@Html.PagedListPager(Model, i => Url.Action("CarrosList", new { i, search = Request.QueryString["search"] }), new { @class = "pagination" })

The pagination class is what the default PagedList.css targets, so this will apply the pre-built button-like styles to your pager links.

3. Verify the CSS file exists in your project #

Double-check that PagedList.css is present in your project's Content folder. If it's missing:

• Reinstall the PagedList.Mvc NuGet package via Package Manager Console:

  Install-Package PagedList.Mvc
  

• Or use the NuGet Package Manager UI to uninstall and reinstall the package—this will restore any missing files.

4. Optional: Use Bootstrap styles (if you're using Bootstrap) #

If your project uses Bootstrap, you can leverage its built-in pagination styles instead. Just keep the same pagination class (Bootstrap targets this too) and ensure Bootstrap's CSS is already referenced in your project. The pager will automatically match your Bootstrap theme.

After following these steps, your pagination should render with clean, styled buttons instead of plain text links.

内容的提问来源于stack exchange，提问作者Miguel Alberto