ComponentOne Pager for ASP.NET Web Forms
Task-Based Help / Working with CSS Selectors
In This Topic
    Working with CSS Selectors
    In This Topic

    C1Pager supports CSS styling, enabling you to completely customize the control's appearance. This topic will walk you through applying CSS styling to the C1Pager control.

    1. In Design View, navigate to the Properties window and locate the CssClass property.
    2. Use the drop-down list to choose the appropriate CSS selector, for this topic, choose the wijmo-wijpager selector.
    3. Switch to Source View and locate the first set of <asp:Content> tags.
    4. Insert <style type="text/css"></style> tags between the <asp:Content> tags. This set of tags will allow you to add CSS styling to your control.
    5. To customize the appearance of the pager, insert the following script between the <style> tags.
      .wijmo-wijpager
      {
      background-color: #002277;
      font-style: italic;
      font-family: Blackadder ITC;
      }
      .ui-page a:link
      {
      background-color: Fuchsia;
      }
      .ui-page a:hover
      {
      background-color: Purple;
      color: White;
      }
    6. Press F5 to run your program. Your pager element should appear as in the following image.

    See Also