Technology Programming

Video: How to Add Effects to a Heading H2 in CSS

Video Transcript


Hi, my name is Brian. I'm a web and graphics specialist and today I'm going to show you how to add a effects to a heading H2 in CSS. So right now I have a very simple web page I've created here. I've got a left div, a right div with the menu and right up here I have an H2 heading. If you want to look at my html on the left here and my text edit, all it is is a H2 tag and a closing H2 tag with my text inside of it. So let's say I want to add some style to this H2, okay. You can specify this specific H2 to style by adding a class within the tags so and all you have to do to add a class is after the tag is labeled before the closing bracket, you add class equals and then whatever you want to name it. Let's name it my heading, okay. I'm going to hit save and now that I have a class on this specific H2 I can target this heading specifically in my external CSS style sheet. So I'm going to go down here and I'm going to add a rule for my class, my heading. Let's just say I want to make it a different color. I can change the color to a red, just refresh this here. Now let's say I want to make a style for all headings, all H2s on my entire web page so not just this one specifically but everywhere. I can also add a rule for just H2s and I'll make that purple and I just delete this that I originally had and now my H2 is purple. So that targets all H2s on the page so if I had another H2 down here, that would also be purple. So there you go that's how you do it, that is how you style an H2 heading using CSS. My name is Brian and thanks for watching.


Leave a reply