Add css link to HTML of HtmlHelper extension method
Question
I have a HtmlHelper extension method as below. It returns an instance of PagedList.Mvc.HtmlHelper.PagedListPager .
The PagedListRenderOptions have specified some css classes. Each view that uses this method needs to add a link to the css file containing the styles. Im finding this repetitive and redundant.
Is there a way I could add the css to the MvcHtmlString instance that is being returned here?
public static MvcHtmlString PagedListPagerCustom(this HtmlHelper helper, UrlHelper Url, PagedList.IPagedList pager)
{
return PagedList.Mvc.HtmlHelper.PagedListPager(
helper,
pager,
page =>
{
return Url.Action("Inspection", "Operation", new { page = page, pageList = true });
},
new PagedList.Mvc.PagedListRenderOptions()
{
LiElementClasses = new List<string> { "pagerLiElement" },
ContainerDivClasses = new List<string> { },
UlElementClasses = new List<string> { "pagerUlElementClasses" },
DisplayPageCountAndCurrentLocation = false,
DisplayLinkToFirstPage = PagedList.Mvc.PagedListDisplayMode.Always,
DisplayLinkToLastPage = PagedList.Mvc.PagedListDisplayMode.Always,
DisplayLinkToNextPage = PagedList.Mvc.PagedListDisplayMode.Always,
DisplayLinkToPreviousPage = PagedList.Mvc.PagedListDisplayMode.Always,
Display = PagedList.Mvc.PagedListDisplayMode.IfNeeded,
LinkToLastPageFormat = "Last",
LinkToNextPageFormat = "Next",
LinkToPreviousPageFormat = "Prev",
LinkToFirstPageFormat = "1st",
DisplayEllipsesWhenNotShowingAllPageNumbers = true,
MaximumPageNumbersToDisplay = 5,
DisplayLinkToIndividualPages = true,
ClassToApplyToFirstListItemInPager = "pagerLiElementFirst",
ClassToApplyToLastListItemInPager = "pagerLiElement",
}
);
}
The css link that I will to add is:
<link href="~/Content/css/PageListCustom.css" rel="stylesheet">
1 answers
solution1
1 ACCPTED 2019-01-21 06:44:54
Unfortunately that is not very easy to achieve. The CSS <link> tag must be in the <head> section as the W3C documentation specifies:
This element defines a link. Unlike A, it may only appear in the HEAD section of a document, although it may appear any number of times. Although LINK has no content, it conveys relationship information that may be rendered by user agents in a variety of ways (eg, a tool-bar with a drop-down menu of links).
This means you cannot just output it as part of your HtmlHelper string, because that will be used in the body of the HTML page. You must instead either add the CSS link manually to the <head> or use inline <style> element which is arguably less clean solution.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.