From the course: CSS Shorts

Unlock this course with a free trial

Join today to access over 22,600 courses taught by industry experts.

Border image

Border image - CSS Tutorial

From the course: CSS Shorts

Start my 1-month free trial Buy for my team

Border image

“

- [Instructor] Hi, this is Chris Converse, and in this episode, we'll use a graphic as a border image by defining a slice size that will control the corners, and repeat properties to control the center areas between the corners. So if you'd like to follow along with me, download the exercise files and we'll begin by opening the html file in a text editor. So when you have the html file open, you'll see that inside of the body area, we have a single article element, and then inside there we have two paragraph elements. So it's a pretty simple layout. If you look at this in a browser, it'll look like this. So to begin applying an image to the border, let's go back to the exercise files. Let's open up Style.CSS in our text editor. And then let's scroll down and find the article selector. So inside of here we have a border property. And the size is set to five pixels. So let's come in here and change the size to 27 pixels. If we hit Save and go back to the browser, we'll now see that this…

Contents