Dreamweaver - HTML and CSS Using Dreamweaver

How to update CSS

Questions

Course info

34 lessons / 3 hours

Overview

Dreamweaver (and web design in general) is such a hard program to teach yourself. We know, because as Dreamweaver trainers we have all taught ourselves. We wish we had a resource like this when we were learning.

Hand coding a website from scratch is now a thing of the past. Web designers use tools like Dreamweaver to a lot of the heavy lifting. We imagine this is your first website build and we're glad we're here to help make this process a little less troublesome. 

Who should use this?

Anyone that is brand new to Dreamweaver and anyone brand new to web design in general. If you're reasonably experienced in web design you might find this course a little slow going.

What do you need?

  • You'll need a laptop (Mac or PC)
  • Dreamweaver CC installed. Dreamweaver can be downloaded from theAdobe website here.

Can I use this tutorial with Adobe Dreamweaver CS4, CS5 or CS6?

No. Unfortunately there were some fundamental changes in the Dreamweaver CC update that makes CC and previous versions very different.

Remember you can download Dreamweaver CC free for 30 days. Don't worry - after your free trial has expired your files will still be updatable using any other web design program.

If you like the tutorials we'd love you to like, share and tweet it. We'd be very grateful.

Daniel Scott

Daniel Scott

Founder of Bring Your Own Laptop & Chief Instructor

instructor

I discovered the world of design as an art student when I stumbled upon a lab full of green & blue iMac G3’s. My initial curiosity around using the computer to create ‘art’ developed into a full-blown passion, eventually leading me to become a digital designer and founder of Bring Your Own Laptop.

Sharing and teaching are a huge part of who I am. As a certified Adobe instructor, I've had the honor of winning multiple Adobe teaching awards at their annual MAX conference. I see Bring Your Own Laptop as the supportive community I wished for when I was first starting out and intimidated by design. Through teaching, I hope to bring others along for the ride and empower my students to bring their stories, labors of love, and art into the world.
True to my Kiwi roots, I've lived in many places, and currently, I reside in Ireland with my wife and kids.

Downloads & Exercise files

Transcript

Hi, and welcome to this Dreamweaver tutorial. My name is Daniel Walter Scott,  and I'm a trainer here at Bring Your Own Laptop. In this, uh, video tutorial, we're gonna look at updating,  uh, an existing CSS. That might be that you've already created it earlier in this  tutorial series, or you might be having somebody else's, um,  website that you're updating. So to update a CSS, um, what you need to do is, a good way  to get started is  to have your cursor selected in the style that you'd like to change. And what will happen on the right hand side here is that  Dreamweaver should be clever enough  and explain which, um, tags being styled.

And you can see here it's told me my H one is being styled. And what I can do now is move through. I'm gonna jump down to, if I wanna change the text  properties for the CSS, go on text  and you'll see here are my, um,  styles again to go and adjust. Now, um, what you can do though is you can go via code,  which we, which we briefly looked at at the last tutorial. If I wanna update this H one, I know it's an H one,  so I want to go and style the H one. Um, CSS, I can go  to the CSS sheet in the top right hand corner.

So I've clicked on main CSS  and I can have a look through my list  and see if I can find the H one. Okay. And then in here I can see there's the color,  there's the font, there's the weight, and there's the size. And say that I want to tie change in here, um,  from normal to bold. Okay, I've gotta make sure the language is spelled right. This is where using CSS can be a little more tricky is I  can't accidentally delete the semicolon at the end.

If I do, uh, dream weve will probably handle that,  but some browsers won't. Okay. So you can see Dream Move is dealing  with it just fine, but if I upload it to my website,  I'm likely to cause trouble for especially older browsers  that can't deal with any sort of semantic problems. Alright, so how to edit your CSS. You can either select it in here  and uh, you can see if I click inside my P tag,  it should drop me down to everything that I've started  with the P or I can do it by clicking the main CSS  and the Related Documents bar  and adjusting it in here if I can find it. Alright, thanks for that.

See you in the next tutorial.
Bring Your Own Laptop
  • Powered by Marvin
  • Terms of use
  • Privacy policy
  • © Bring your Own Laptop Ltd 2025