Stylesheets
Stylesheets are simple text-based resource files containing Cascading Style Sheets that affect the look of the template in the Workspace as well as when generating any output. They are applied individually for each Section within a Context, giving fine-tuned control over how each part of a template generates output.
Applying a Stylesheet
In order for a Stylesheet to be applied to any specific Section, it needs to be included in that section. There are two ways to do this.
Drag & Drop a Stylesheet:
- Click and hold the mouse button on the Stylesheet in the Resources Pane.
- Move the mouse cursor to the Section within the Resources Pane where the Stylesheet should be applied.
- Release the mouse button.
Using the Includes dialog:
- In the Resources Pane, right-click on the desired Section, then click Includes.
- Add a checkmark to any Stylesheet that should be included in the Section.
CSS Order of Precedence
CSS properties can be added at different locations and levels, so the order in which they are evaluated is important. The following order indicates which are evaluated first. When rules from further down are for the same element, class or ID, they override previously defined rules.
- Stylesheets: The first location to be evaluated is Stylesheets from the Resources Pane. Stylesheets are evaluated from top to bottom, where styles in lower Stylesheets may override ones previously defined.
- Embedded Styles (Not available in PlanetPress Connect): Any styles added to the <style> tag within the <head> are evaluated and override external Stylesheets.
- Inline Styles: Any element that has a style attribute takes precedence over any previous styles that may have been applicable to the element.