Applying Styles using BlueGriffon
Formatting Content
My choice to start spending more time exploring BlueGriffon was motivated in large part to the ease in experimenting with and applying CSS styles.
In order to see the options you have for any given element open up the Style Properties dialog by selecting Style Properties from the Panels menu.
The style properties is broken into several categories, here are the ones I use the most often:
- General - define a font size, style or family.
- Colors
- Geometry
- Position And Layout (for Images)
- Borders
- Tables
Before you can change anything you have to determine how it is applied. These are the options available and what they mean.
CSS Selection Options |
|
|---|---|
id selectors |
The option "this element only through its ID" is used when you only want to apply a style to one particular element on a page. |
class selectors |
The option "all elements of class..." is used to select all elements that have been assigned a particular named class. Once you choose this option, you would have to identify a class name. |
type selectors |
The option "all elements of same type" applies style
changes to any HTML element on a page that matches the
selector, such as <p>, <h1>, <li>, etc. |
inline styles |
Inline styles are chosen by selecting "this element,
through inline styles." These will be applied directly in
the HTML markup. If your intention is to reuse a style
across multiple pages, in your website these should be
avoided. |
To see all the element tags in your document from the Wysiwyg
view you can select View|All Tags Mode 
Type is probably the most common to use when you are in thee early stages of creating a site. You can select and see all elements of a particular type using the structure bar below the view toggle buttons at the bottom of the screen. The structure bar shows a hierarchical view of the element types.
Copyright © 2017 Deborah Mundorff