From the course: Dreamweaver CC Essential Training
Unlock the full course today
Join today to access over 22,500 courses taught by industry experts or purchase this course individually.
CSS Designer overview - Dreamweaver Tutorial
From the course: Dreamweaver CC Essential Training
CSS Designer overview
- [Instructor] The CSS Designer is a powerful panel that not only creates style rules, but also lets you inspect and edit the styles that apply to specific elements in a page, while displaying it in live view. I've opened info.html, in the Chapter 7 07_03 folder of the exercise files. If you look at the head of this page in code view, you can see that it links to two external style sheets. On line six, it's linking to main.css, and on line seven, to navigation.css. And if I scroll down a little bit, on lines 12 through 17, is an embedded style block that contains a style rule that applies to this page only. This isn't how I would normally organize the styles, but I've done so for this exercise, in order to put the CSS Designer through its paces. The CSS Designer packs in a lot of information, so when working with it, I like to collapse the other panels by double-clicking the bar alongside the tabs in the bottom panel group. And we need to go to the CSS Designer, it's the fourth tab at…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Contents
-
-
-
-
-
-
-
-
-
CSS workflows in Dreamweaver CC 20172m 4s
-
Set CSS preferences6m 6s
-
CSS Designer overview7m 41s
-
Attach an external style sheet11m 15s
-
Create a new CSS rule in the CSS Designer9m 1s
-
Styling text8m 18s
-
Use an Adobe Edge web font7m 20s
-
Create a custom font stack3m 43s
-
Style links6m 32s
-
Style basic layout properties9m 42s
-
Style borders3m 37s
-
Style background properties8m 50s
-
Style additional properties3m 53s
-
Add a media query8m 22s
-
Use CSS Inspect3m 47s
-
-
-
-
-