This is not a definitive guide to every style scenario but a guide to help the new Flux user get to grips with the basic principles and quickly produce a web page.
Flux uses two types of style.
Inline - this type of style is contained with the element it is associated with in the body of the html/xhtml page.
External - this type of style is a separate file within the site folder. Elements within the body of the html/xhtml page link to this style.
The inspector displays the style attributes and shows if the style is inline or external.
The styles window lists external styles associated with the site.
When you place an element on the page in the Flux edit window Flux automatically creates an Inline style for this element. As you edit the style in the Inspector Flux updates this style for each change.
To convert an Inline style to an External one right click the element, in the Edit window, to show the contextual menu for the element and select 'Create style with' option.
From the drop down menu add a name for your new External style and choose from
ID - a unique style name for your element.
Class - a style name to be applied to a group of elements.
Check remove Inline styles from source object.
Elements can have style name associated to them.
ID - a unique style name for a single element and will be shown in the styles window with a # preceding the name like #mystyle
Class - a style name that can be applied to many elements and will be shown in the styles window with a . preceding the name like .classstyle
There are many defined styles like p, li, .... these styles have default values set within browsers so you can still use them without defining them or adding them to your styles list. Should you not be happy with the default style assigned to these elements you can add them to your style sheet and edit them to suit your needs.
To do this click the + at the bottom of the Styles window, select Override Style followed by the element you want to override the style of.
Some styles override other styles. This can become quite complicated but all the beginner has to remember is that an Internal style overrides an External style.
Some style attributes can be inherited from parent to sibling. Flux allows you to set inherit if it is possible. TARGETING STYLES
Lets say you have used the Gallery Plugin to create a gallery and this gallery is placed within a containing div.
If you give this div an ID of #mygallery you can target elements within this div. In this case the gallery has thumbnail images with the img tag. To target just these images use a style name like this '#mygallery img' this style will only style images within the #mygallery div. It is now simple to add margins and borders to give a professional looking individual style to your gallery thumbnails.