body{
background-repeat: repeat;
background-repeat: no-repeat;
background-repeat: repeat-x;
background-repeat: repeat-y;
}
				
			

Video Summary

This is the property of background repeat. And this is how we can manipulate when you have images that are repeating. And within the last example, we had an image that we took from Google. And we went through and we made the background for the whole body and it just kept repeating because the image wasn’t large enough to cover the whole space. So when you have this, you might want to have the image, repeat, not repeat or repeat on the X and Y axis. So with that being said, it’s, it’s a pretty straightforward example. I’m just gonna hop right in the code pen and we’re gonna start playing around. 

Alright, so right here is we have the body. So basically, like everything that’s in the background of the webpage, has this super long URL image in it. So I’m just gonna scroll all the way to the bottom. And we’re going to make sure I have a semicolon because otherwise our code wouldn’t have worked. And we’re gonna go and redo background repeat. And if you put in repeat nothing’s going to happen because that’s the default version of the of the image or the background image since it was large enough that it does repeat, but now if we don’t want it to repeat all we have to do is put in now.

All right, bye. I didn’t have my G right there. Alright, that’s what happened. So basically a background repeat. And we have no repeat. And if you want to see since I didn’t have that correct, no, we have repeat. And now it does repeat. Now if we want to just say how they go the width, we could do a dash x, and now it will just repeat from all the way horizontally and if we want it to repeat all the way vertically. 

We can have that there. Um, you might run this you might not odds are having having this pitcher repeat a bunch of times very come comes in or is really, really used. But when you get an image that is starting to repeat, or is just big enough to where it would work say they said we have this out here. 

And it just like the image is large enough and it just repeats maybe at the very bottom. And you know that’s where we come in and we say we do not want that to repeat. We just want this right here in this section. If that’s the case, that’s where we use this for. Again, we’re probably not going to use this a ton but when it comes to not having stuff repeat is a really important thing to focus on. Because sometimes you have a picture. Maybe you or your client has given you a picture that almost is big enough it’s going to work but you don’t want like the extra kind of quarters at the end where it’s just starting repeats to say if there was an image, like start with the next image right here and start with another image right there. you’re like you know what, this looks just fine. we’ll use the note repeat function. Alright with that being said, this is pretty straightforward. Let’s move on to the next section.