Adobe Dreamweaver CC 2015 - Manual (Page 218)

211
CSS
Last updated 6/3/2015
Convert inline CSS to a CSS rule
Note: In Dreamweaver CC and later, CSS Styles panel is replaced with CSS Designer. For more information, see CSS
Designer.
In-line styles are not recommended best practices. To make your CSS cleaner and more organized, you can convert
inline styles to CSS rules that reside in the head of the document or in an external style sheet.
1 In Code view (View > Code), select the entire style attribute that contains the inline CSS you want to convert
2 Right-click and select CSS Styles > Convert Inline CSS to Rule.
3 In the Convert Inline CSS dialog box, enter a class name for the new rule, and then do one of the following:
• Specify a style sheet where you want the new CSS rule to appear and click OK.
• Select the head of the document as the location where you want the new CSS rule to appear and click OK.
You can also convert rules by using the Coding toolbar. The Coding toolbar is available in Code view only.
More Help topics
Insert code using the Coding toolbar
Link to an external CSS style sheet
Note: In Dreamweaver CC and later, CSS Styles panel is replaced with CSS Designer. For more information, see CSS
Designer.
When you edit an external CSS style sheet, all documents linked to that CSS style sheet are updated to reflect those
edits. You can export the CSS styles found in a document to create a new CSS style sheet, and attach or link to an
external style sheet to apply the styles found there.
You can attach to your pages any style sheet that you create or copy into your site. In addition, Dreamweaver is shipped
with prebuilt style sheets that can be automatically moved into your site and attached to your pages.
1 Open the CSS Styles panel by doing one of the following:
• Select Window > CSS Styles.
• Press Shift + F11.
2 In the CSS Styles panel, click the Attach Style Sheet button. (It’s in the lower-right corner of the panel.)
3 Do one of the following:
• Click Browse to browse to an external CSS style sheet.
• Type the path to the style sheet in the File/URL box.
4 For Add As, select one of the options:
• To create a link between the current document and an external style sheet, select Link. This creates a link href
tag in the HTML code, and references the URL where the published style sheet is located. This method is
supported by both Microsoft Internet Explorer and Netscape Navigator.