10.2 CSS Operations


Table 10-2 gives a quick overview of using CSS Styles in Dreamweaver. The remainder of the chapter covers these operations in detail.

Table 10-2. CSS operation summary

Operation

Shortcut

Open the CSS Styles panel

Window figs/u2192.gif CSS Styles, Shift+F11, or the CSS Styles icon in the Launcher bar

Add a style to an internal or embedded stylesheet

Text figs/u2192.gif CSS Styles figs/u2192.gif New Style

Attach an external stylesheet using the <link> tag [1]

Text figs/u2192.gif CSS Styles figs/u2192.gif Attach Style Sheet

Attach an external stylesheet using the @import directive

Text figs/u2192.gif CSS Styles figs/u2192.gif Edit Style Sheet figs/u2192.gif Link figs/u2192.gif Import

Detach an external stylesheet

Text figs/u2192.gif CSS Styles figs/u2192.gif Edit Style Sheet figs/u2192.gif Remove

View a list of external stylesheets and embedded styles

Text figs/u2192.gif CSS Styles figs/u2192.gif Edit Style Sheet;

Ctrl+Shift+E (Windows); Cmd+Shift+E (Macintosh)

Export embedded styles to an external .css file

Text figs/u2192.gif CSS Styles figs/u2192.gif Export CSS Styles

Convert CSS styles to HTML styles

File figs/u2192.gif Convert figs/u2192.gif 3.0 Browser Compatible

Apply a class selector [1]

Text figs/u2192.gif CSS Styles figs/u2192.gif stylename or use Set Class in the Tag Selector's contextual menu

Apply an ID selector

Use Set ID in Tag Selector's contextual menu

Duplicate an embedded style

Text figs/u2192.gif CSS Styles figs/u2192.gif Edit Style Sheet figs/u2192.gif Duplicate

Duplicate an external style

Text figs/u2192.gif CSS Styles figs/u2192.gif Edit Style Sheet figs/u2192.gif Edit figs/u2192.gif Duplicate

Delete an embedded style [1]

Text figs/u2192.gif CSS Styles figs/u2192.gif Edit Style Sheet figs/u2192.gif Remove

Delete an external style from an external stylesheet

Text figs/u2192.gif CSS Styles figs/u2192.gif Edit Style Sheet figs/u2192.gif Edit figs/u2192.gif Remove

View a list of styles in an external stylesheet

Double-click .css file in Site window; Ctrl-click (Windows) or Opt-click (Macintosh) the Edit Style Sheet button in the CSS Styles panel

Remove a style attached to a single element (clear styling) [1]

Text figs/u2192.gif CSS Styles figs/u2192.gif None

[1] Also available as an option in the CSS Styles panel.

We'll continue our top-down tour of CSS styles in sequential order. We'll cover the different places where CSS styles can be stored and then cover the different types of CSS styles.



Dreamweaver in a Nutshell
Dreamweaver in a Nutshell
ISBN: B000C4SPTM
EAN: N/A
Year: 2005
Pages: 208

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net