Posted By:
michael_barbarino
Posted On:
Tuesday, October 9, 2001 03:09 PM
The short answer is to use cascading style sheets. Somewhere in the head tag of your HTML/JSP, do somwthing like the following:
the file 'my.css' could look something like this:
/* the font for everything is defined here */
body {font-family:verdana,helvetica,arial,sans-serif; font-size:10pt;}
/* definition for fonts for other tags, to insure they are the same as 'body' */
td {font-family:verdana,helvetica,arial,sans-serif; font-size:10pt;}
li {font-family:verdana,helvetica,arial,sans-serif; font-size:10pt;}
/* links are the same color as the text, but they are underlined and change color in IE and NS6 */
a:link {font-family:verdana,helvetica,arial,sans-serif; color:black; text-decoration:none;}
a:visited {font-family:verdana,helvetica,arial,sans-serif; color:black; text-decoration:none;}
a:hover {font-family:verdana,helvetica,arial,sans-serif; color:blue; text-decoration:none;}
.whitelink {font-family:verdana,helvetica,arial,sans-serif; color:white; text-decoration:none;}
/* classes to define different font sizes and emphasis */
/* note the 'tty' class which should be used for form input fields to provide consistent lengths across browsers */
.big {font-family:verdana,helvetica,arial,sans-serif; font-size:16pt;}
.indent {font-family:verdana,helvetica,arial,sans-serif; font-size:10pt; text-indent: 3em;}
.body {font-family:verdana,helvetica,arial,sans-serif; font-size:10pt;}
.smaller {font-family:verdana,helvetica,arial,sans-serif; font-size:9pt;}
.small {font-family:verdana,helvetica,arial,sans-serif; font-size:8pt;}
.tty {font-family:monospace; font-size:10pt;}
.fixed {font-family:monospace; font-size:10pt;}
.errmsg {font-family:verdana,helvetica,arial,sans-serif; font-size:9pt; color:red;}
.footnote {font-family:verdana,helvetica,arial,sans-serif; font-size:10pt; color:blue;}
the tags with the '.' preceeding them can be used in the HTML font tags like this:
some stuff here
This last will allow you to have a consistent display for certain classes of output that can then be easily changed globally, in one file.
Note that for text input fields in IE and NS browsers, you will have problems unless you use a fixed-width font. In the preceeding CSS example, I would use the 'fixed' tag to make sure that input fields are the same width across browsers. E.g.:
