beautypg.com

Edit a css style sheet, Format css code – Adobe Dreamweaver CS3 User Manual

Page 147

background image

DREAMWEAVER CS3

User Guide

140

See also

“Create a page based on a Dreamweaver sample file” on page 73

Edit a CSS style sheet

A CSS style sheet typically includes one or more rules. You can edit an individual rule in a CSS style sheet using the
CSS Styles panel, or if you prefer, you can work directly in the CSS style sheet.

1

In the CSS Styles panel (Window > CSS Styles), select All mode.

2

In the All rules pane, double-click the name of the style sheet you want to edit.

3

In the Document window, modify the style sheet as desired, and then save the style sheet.

Format CSS code

You can set preferences that control the format of your CSS code whenever you create or edit a CSS rule using the
Dreamweaver interface. For example, you can set preferences that will place all CSS properties on separate lines,
place a blank line between CSS rules, and so on.

When you set CSS code formatting preferences, the preferences you select are automatically applied to all new CSS
rules that you create. You can, however, also apply these preferences manually to individual documents. This might
be useful if you have an older HTML or CSS document that needs formatting.

Note: CSS code formatting preferences apply to CSS rules in external or embedded style sheets only (not to in-line styles)

See also

“Change the code format” on page 309

Set CSS code formatting preferences

1

Select Edit > Preferences.

2

In the Preferences dialog box, select the Code Format category.

3

Next to Advanced Formatting, click the CSS button.

4

In the CSS Source Format Options dialog box, select the options that you want to apply to your CSS source code.

A preview of the CSS as it would look according to the options you’ve selected appears in the Preview window below.

Indent Properties With

Sets the indentation value for properties within a rule. You can specify tabs or spaces.

Each Property On A Separate Line

Places each property within a rule on a separate line.

Opening Brace On Separate Line

Places the opening brace for a rule on a separate line from the selector.

Only If More Than One Property

Places single-property rules on the same line as the selector.

All Selectors For A Rule On Same Line

Places all selectors for the rule on the same line.

Blank Line Between Rules

Inserts a blank line between each rule.

5

Click OK.

Note: CSS code formatting also inherits the Line Break Type preference that you set in the Code Format category of the
Preferences dialog box.

Format CSS code in a CSS style sheet manually

1

Open a CSS style sheet.

September 4, 2007