Web design & Internet tutorials
Search the site...
Home» Tutorials » CSS » Using Dreamweaver CS5 Inspect to test Cascading Style Sheets

Using Dreamweaver CS5 Inspect to test Cascading Style Sheets

Posted by Janine Warner - September 3, 2012 - CSS, Dreamweaver CS5, Dreamweaver CS6, Tutorials
0

If you’ve faced the frustration of designing a web page in CSS only to find it doesn’t look right in some web browsers, or your styles seem to be conflicting with each other, you may be happy to discover the CSS Inspect feature, added to Dreamweaver CS5 and available in later versions as well.

How to turn on the CSS Inspect features in Dreamweaver

Dreamweaver CS5 adds a new tool designed to help you identify how CSS is used in a Web page. The CSS Inspect option makes it easy to quickly view the CSS that defines the styles used in different parts of any web page.

Here’s how CSS Inspect works:

1. To use CSS inspect, click the Inspect button at the top of the workspace to activate inspect.

2. Click on the text link Switch Now (it appears just below the Inspect button).

The Switch Now link automatically changes the Dreamweaver program layout to best take advantage of the CSS Inspect feature.

3. Once it’s activated, roll your cursor around the screen to use CSS Inspect.

As you do, Dreamweaver highlights content in the Design View area with color-coded highlighting that identifies each tag and associated style, as well as any margins and padding created by the style rule.

Simultaneously, Dreamweaver identifies the corresponding code in Code View, and displays the corresponding style rules in the CSS Styles panel. Click the Inspect button again to turn off CSS Inspect.

css, dwcs5, dwcs6

Leave a Reply

You must be logged in to post a comment.

This site uses Akismet to reduce spam. Learn how your comment data is processed.

1&1 Hosting

Recent Posts

  • Google Analytics for Creative Professionals – new class on Pluralsight
  • Follow the cursor JavaScript sample
  • Part Four: Tools that let amateurs look like professionals
  • Part Three: Influence, Klout and finding what’s hot
  • Best social media tools part 2: Twitter, Instagram and Pinterest




© 2001 - 2020 All rights reserved. DigitalFamiliy.com | Terms & Conditions of Use | Privacy Policy

This is a demonstration store. No physical products will be shipped. Dismiss