Build Your Own Business Website header image

Install NetBeans 7.0 – Part 5, Write Your First CSS Rule

Difficulty Level -

Filed Under Topics -

Listed Under Lesson Subjects -

Whoops, you've found some premium content!

Watch the opening clip of this video to preview it,
the full video is available to paid members.

We cover the installation and configuration of NetBeans 7 which just came out last week in a 5 part video series. In this fifth and final part we show you how to write a CSS rule in your custom.css file. We review the blank css file, show you where to create your rules and then create a new rule.

Video Transcript

Rick: So this is where if you’re following you know, one of my videos, this is where you type in the custom css rule, whatever it happens to be. No, no…down. Those are… remember from that 2nd series of lessons, this is a comment block, right? This is a how a comment starts and a comment ends in css. So you don’t type inside the comment block. You start entering your information directly below it.

Jared: Right here?

Rick: No, directly below line 26 inside the edit screen there.

Jared: Okay.

Rick: So if you place your cursor outside of the comment block on line 26 and hit enter… go ahead and hit enter… there you go. Now you can type .custom #header #logo enter… { enter. Okay now see where your cursor is? For example, let’s just say you want to set the font. So actually, why don’t you widen the NetBeans up so it fills the width of your screen there? There you go, okay. So now you can see down where under font you could for example, pick Times New Roman, right? If you go down there and select Times New Roman… okay, now let’s put font family Times New Roman in there. Now, if you’d go down to the font size on the right hand side, now your header logo has been reduced down to 12 pixels. Well, it’s currently probably in the you know, 24 range or something like that. But okay…so, you don’t see me using this tool very much because I want people to you know, get the sense of how to you know, type code. But you can now you know, move your way through the different parts of the code and add stuff to this rule. You’ve now created your first style rule which will make your site name… which is called #header #logo. It’s going to make your site name have Times New Roman text and be a font size of 24 pixels.

Jared: And because I opened this in the setup in My Computer in my file, this is making the changes inside there. So then when I upload this using ftp upload, I would see changes in my site.

Rick: That is exactly correct, yes. That’s how that works.

Jared: It was getting this stuff here that I was concerned with. I didn’t know.

Rick: Yeah well, it’s just the process of…

Jared: It was going through the file, open into NetBeans that I didn’t understand.

Rick: Yeah.

Jared: But this part here, I can figure out from your videos and stuff like that.

0 Comments… add one
0 comments… add one

Leave a Comment