Font styles should be used very rarely. The portal itself sets the default font style to portlet-font, so regular default text should be taken care of. Font styles themselves should only be used when another mechanism in the defined CSS or HTML standards do not cover the case sufficiently.
For example, the
portlet-font-dim style is defined because HTML has no inverse of its
<strong>
or
<em>
tags. There is no
portlet-font-strong or
afsc-font-strong style defined, because the HTML
<strong>
tag has the same effect. The same goes for the
<em>
tag.
Occasionally, one may need to use these styles, except have the font slightly larger or smaller. In this case the proper form to do this is with an embedded style of relative style. Some examples:
| Code | What it does |
|---|---|
<div style="font-size: larger">Important information</div>
|
Displays the text in normal style as defined be portlet-font only slightly larger. |
<span class="portlet-font-dim" style="font-size: 80%">Less important information</span>
|
Displays the text in a lighter color than normal text (as defined by the portlet-font-dim style), and at 80% of the size defined by regular portlet-font-dim text. |
This page details the font styles defined by AFSC and the Portlet specifications (Java Portlet Specification and Web Services For Remote Portlets). The portlets below show the correct ways to implement these styles in your HTML, as well as serve as an example and test bed to see how the different styles render. Please see the different portlets below for when it is appropriate to use each individual style.