JavaScript Style Sheets

Netscape (who developed JavaScript, which still endures long after the rest of Netscape's unique details have passed into the mists of the past) also developed their own style sheet language based on JavaScript and the document model. This small file duplicates some of the styles seen in some of the other examples on this site, but using their unique JavaScript style sheets. This file meets with the standard for HTML 4.01 Transitional since style sheets are not a part of HTML itself. Unfortunately, the stylesheet effects will only display on Netscape versions older than 6.

Even the opening <BODY> declaration tag has some of the JavaScript style sheet contents:

<BODY STYLE="backgroundColor = 'white'; color = 'black'">

For reference, I show here the style sheet commands used in this file:

<STYLE TYPE="text/JavaScript">
<!--
with (classes.key.SPAN) {
  fontFamily = 'arial, helvetica, sans-serif';
  fontSize = 'smaller';
  color = 'white';
  backgroundColor = 'black'
  textTransform = 'capitalize';
  paddingTop = '1px';
  paddingBottom = '1px';
  paddingLeft = '4px';
  paddingRight = '4px';
  borderTopWidth = '2px';
  borderBottomWidth = '2px';
  borderLeftWidth = '2px';
  borderRightWidth = '2px';
  borderColor = 'gray';
  borderStyle = 'solid';
  }
classes.und.SPAN.textDecoration = 'underline';
classes.stk.SPAN.textDecoration = 'line-through';
with (classes.abc.ISINDEX) {
  fontFamily = 'courier, monospace';
  fontSize = 'large';
  color = 'black';
  backgroundColor = 'magenta'
  textTransform = 'capitalize';
  }
  // -->
</STYLE>

Note here the one case where the TYPE attribute of the <STYLE> tag actually gets something different than the usual "text/css" but "text/JavaScript" instead.

This one is taken from the <KEY> examples:

<P>Press the <SPAN CLASS="key">AltGr</SPAN> key to enter letters with
diacritical marks on those keyboards that support them.</P>

Press the AltGr key to enter letters with diacritics on those keyboards that support them.

Here is another example taken from the <KEY> demonstration file:

<P>No difference between this <U>underline</U> and this
<SPAN CLASS="und">underline</SPAN>.</P>

No difference between this underline and this underline.

And again a third example from <KEY>:

<P>No difference between this <STRIKE>strikethrough
text</STRIKE> and this <S>strikethrough text</S> and this
<SPAN CLASS="stk">strikethrough text</SPAN>.</P>

No difference between this strikethrough text and this strikethrough text and this strikethrough text.

Here is one adapted from the <ISINDEX>:

<ISINDEX PROMPT="Starts from the right, is large font, blue monospace,
and capitalizing the first letters:" TITLE="See what &lt;ISINDEX&gt; does
do with the TITLE attribute" CLASS="abc" STYLE="color = 'blue'"
LANG="en-US" DIR="RTL">

This file, "jscss.html," is HTML 4.01 Transitional compliant.


Next Level Up