a:hover{
font-size: 30px;
color: blue;
}
				
			

Video Summary

Alright, this section we are going to learn about pseudo classes and pseudo classes are the main one we’re going to encounter is the hover effect. And basically what we’re saying is is that we save we have an a tag and this is supposed to be a link. And we have styling that made so when you’re just looking at it as a certain style, but when you hover over it, you’re gonna have a different style. Right? And it’s pretty straightforward. All you know, all the differences is that we just have to have a completely different section for this selector or this HTML element. And then we’re going to put in a colon and just put hover with no space and then we’re going to be able to manipulate the certain element that we want when someone hovers over it. So let’s just hop in. This is a pretty straightforward example. So where we have over here is we just have a p tag, and we just have a simple paragraph and what I did over here is I made this paragraph, font size three and what we want to do is we want to make a hover effect when when someone’s cursor goes over this paragraph. So what we’re gonna do is we’re hit P, and we’re going to hit colon and we’re gonna type in hover and what we’re going to do is we’re going to open this tag up, we’re going to or the curly brackets and we’re going to say we’re gonna make the color blue when we hover over. 

Alright, so now if we hover over, it changes to blue and whatever and you can do a bunch of different stylings, too so let’s just say let’s make with the person. So we get here, boom, you get over here and as you can see, to no matter where the original tag was, or the original paragraphs that add change it to blue and it cuts it in half, at least the width. And you can do this with your new images. You can do this with buttons. Buttons are a huge one as well, because if you hover over a button and it changes color, it kind of entices like hey, this is clickable. 

So you’re gonna encounter this, there’s a few other ones there’s active and we’ll kind of get into that when we talk about nav bars, but we’ll kind of cover those when we when we get to that in when we start getting into actually building the actual web sites start manipulating certain things. But the ones that you’re going to use the most is hover. And I always like to have a nice hover effect when I have when I have an action or want them want the user to do something. So if say if this was a link, and they hovered over it, something’s changed during the cut, you know, let’s just say if we take the width off, and the color change, the color change. And now in there in the users mind this, this could be clickable. This is a paragraph it’s not but the principle is the same. So with that, being said let’s hop over and talk about pseudo elements.