How to Use CSS Cascade in Adobe Dreamweaver

Web designers can define style rules in three different places: in an external style sheet, an embedded style sheet, or inline in an element. Using external style sheets is generally the best approach as it allows you to apply a single style sheet to an unlimited number of HTML files. But there may be times when an embedded style sheet or inline style is preferred.

Embedded Style Sheets

You can use an embedded style block to apply a set of styles to an individual page. When you edit the style block, all of the styles in the page are updated. Embedded styles will override linked styles.

To create an embedded style in Dreamweaver, select "(Define in Page)" for the Rule Definition:
CSS Designer Define in Page

Inline Styles

Generally, you should avoid using inline styles since you will not be able to reuse them in the same document or in others. They may be a quick way to add a style, but they are not always efficient in the long run, as each time you need to make an update you must go back to each tag and perform an edit. Use an inline style to apply a one-time special style directly within a tag.

Inline styles are applied directly to an element within the HTML code using the style attribute. The value of the style attribute is a list of one or more property-value pairs separated by semicolons. The code snippet below illustrates how inline styles are used:

<p style="color:red; font-weight:bold;">Hello, world!</p>

To add inline styles:

  1. Place your cursor in the Heading 1.

  2. In Properties, click CSS.
    Targeted Rule

  3. Select <New Inline Style> from the Targeted Rule menu.
    New Inline Style

  4. Click the Edit Rule button.

  5. Style the heading as desired.
    Edit Current InLine Style
Author: Tracy Berry

Tracy has been a senior graphic designer/programmer, instructor, and consultant since 1993 and has developed hundreds of logos, marketing materials, websites, and multimedia solutions for customers worldwide, including involvement in large corporate software rollouts. She has helped many organizations optimize and streamline data solutions. She teaches both onsite and online courses and has her CTT (Certified Technical Trainer) certification. Tracy specializes in teaching graphics, desktop publishing, web design, reporting/productivity applications, as well as the creation of online courses with software from leading vendors.

About Webucator

Webucator provides instructor-led training to students throughout the US and Canada. We have trained over 90,000 students from over 16,000 organizations on technologies such as Microsoft ASP.NET, Microsoft Office, Azure, Windows, Java, Adobe, Python, SQL, JavaScript, Angular and much more. Check out our complete course catalog.