Windows Library for JavaScript style sheets

  • Article

To give your Windows app using JavaScript the Windows 8 look and feel, you just need to include one of the two default style sheets provided by the Windows Library for JavaScript:

  • ui-dark.css: Defines a look and feel that has a dark background and a light foreground. This style sheet is best for apps that mostly display images or video. To use this style sheet, add this reference to your HTML:

    <link href="//Microsoft.WinJS.2.0/css/ui-dark.css" rel="stylesheet">

  • ui-light.css: Defines a look and feel that has a light background and a dark foreground. This style sheet is best for apps that contain a lot of text. To use this style sheet, add this reference to your HTML:

    <link href="//Microsoft.WinJS.2.0/css/ui-light.css" rel="stylesheet">

Giving your application the Windows 8 look and feel doesn't mean it can't have its own unique touches. You can override the CSS classes in the style sheet or use them to customize elements of your app. For more info about how to best take advantage of WinJS styles, see Quickstart: Styling controls.

In this section

Topic Description

CSS classes for HTML controls

Classes that you can use to style HTML controls.

CSS classes for Windows Library with JavaScript controls

Classes that you can use to style Windows Library for JavaScript controls.

 

Quickstart: Styling controls