PageOutline(1-5, Contents)

Table of Contents Font Effects Properties Colour Inheritance Rocket effects

Font effects are an extension to CSS for RCSS for applying effects, such as outlining or shadowing, to text. Similarly to [wiki:documentation/RCSS/Decorators], font effects are declared and named in a style sheet like a property, and configured with font-effect-specific properties. Custom font effects can be developed to apply arbitrary effects onto text.

Font effects are declared and configured within style sheets in exactly the same manner as [wiki:documentation/RCSS/Decorators] (except they are declared as 'font-effect' rather that 'decorator'), including the 'z-index' property to resolve an ambiguous render order. The only exceptions are noted below:

All font effects have a 'color' property which is applied multiplicatively over the entire effect.

Unlike decorators, font effects are inherited from parent elements. For example, the following declaration:

will add an outline effect on the text within all 'h1' elements and their descendants. To prevent inheritance, override the effect with 'none'. For example, to prevent the 'h1' outline effect from affecting 'span' elements, you could specify the following:

Rocket comes with two built-in font effects:

 1. For rendering shadows, the [wiki:documentation/RCSS/FontEffects/Shadow shadow] effect.
 1. For outlining text, the [wiki:documentation/RCSS/FontEffects/Outline outline] effect.