The NPDS Cascading Style Sheet

New in this version of NPDS is a revamped HTML engine that generates nearly perfect HTML 4.0 code. A new paradigm in presentation of web content is to send the information separate from the formatting. This allows immense flexibility on the part of the author, the server, and the browser in the way content is presented.

All the font and style information has been stripped from the HTML created by NPDS. This data is now expected to be contained in a Cascading Style Sheet, which is a declaration of how the various elements of a page should be rendered. A definitive reference on style sheets can be found at the W3 web site but I'll briefly describe what this means to you in the rest of this section.

A Basic Style Sheet

A typical style sheet looks something like this:

<STYLE TYPE="text/css">

<!--

BODY {

BACKGROUND-COLOR: #ffffff;

FONT-FAMILY: Chicago, sans-serif;

FONT-SIZE: MEDIUM}

EM { FONT-STYLE: italic }

H1 { FONT-SIZE: X-LARGE,

BACKGROUND-COLOR: #66cc99,

FONT-FAMILY: Charcoal }

H2 { FONT-SIZE: LARGE }

STRONG { FONT-WEIGHT: bold }

TD.HILITE { BACKGROUND-COLOR: #dddddd }

CODE { FONT-FAMILY: Courier, monospace }

-->

</STYLE>

You can have this data inline within the web page or it can be imported as a separate file. If you view the source of a NPDS web page, you'll see our style sheet up in the HEADer region of the source. This style sheet is inserted into all HTML generated by NPDS (if this function is turned on).

The power of this approach, you may be able to see is that all instances of say, H1, will have a large font, a background color of light green, and be rendered in the font face "Charcoal". Note also the TD.HILITE element: this is a special class of the TD element that has a colored background. I actually use this element to highlight the elements in DateServ.

NPDS extends this power by using the formatting Server Side Includes in its default style sheet. This way, the style sheet can be re-written by either hand-coding it or more easily, by interacting with the NPDS Setup application.

Editing or Configuring Use of the Style Sheet

Under the Content tab of the nHTTPd Preference application, you'll find two controls for the Style Sheet. You can turn Style Sheets on or off if you wish and you can also open a window in which you can edit the style sheet used by NPDS.

The Style Sheet Editor

The CSS editor is a floating window that you can scroll around in. Three buttons adorn the bottom of the window:

  1. Default: Restore the Style Sheet to the built-in default
  2. Revert: Erase all changes you have made since the last time you saved the Style Sheet
  3. Save: Finalize Changes you've made to the Style Sheet.

If you are editing the style sheet with NPDS still running, make sure to tap the Apply button in the main NPDS Setup application in order to load the new style sheet into NPDS' memory.

Browser Support for Cascading Style Sheets

Ironically, our NPDS servers are more compliant with W3 standards than are a siginificant fraction of desktop or handheld WWW browsers. Versions of Navigator before 4.x can't understand them and the implementation under MSIE 3.x was buggy and inconsistent. Mileage may vary with other browsers. Therefore, NPDS detects whether a user is visiting with a CSS-enabled browser and will NOT transmit the CSS data if the browser is too old to understand it.

As of this version of NPDS, MSIE 4.x, 5.x, and Mozilla 4.x are considered CSS-enabled and are sent the data. If you use another browser that is truly CSS compliant, please email me the User Agent field for it and I'll add it to the list of enabled browsers.

Links to Style Sheet Information and Tutorials