Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Preview
Start a free Courses trial
to watch this video
Explore some styling techniques in CSS, including the background color, margin, and padding.
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
In this video we're gonna talk about how
to set the background and body styling.
0:00
Let's get started.
0:04
The first thing you find here on our style
sheet is the background color, and when
0:06
you hover over this hexidecimal number, it
matches the background color to our page.
0:11
You should change this color to something
you like.
0:16
So I've linked a few pages about
hexadecimal colors in the teacher's notes.
0:19
Next you have the body styling, even
though there's no text on our webpage,
0:23
the button images are all located inside
the body.
0:29
So we have to make sure they follow the
styling we want.
0:32
Here I've used two numbers to describe the
margin.
0:35
Margin and padding works in directions,
starting at the top and going clockwise.
0:39
Top, right, bottom, and left.
0:44
However, in our body styling.
0:46
We only use two values to describe the
margin, zero and auto.
0:48
This means the top and
0:53
bottom will have the same value, and the
left and right will have the same value.
0:54
The zero says there's zero top and bottom
margin, and
0:59
auto tells the browser to automatically
determine the left and right margin.
1:03
And set them equal.
1:08
That was a lot of information.
1:11
Stay tuned for a code challenge on how to
add a background color, margin, and
1:12
padding in your CSS.
1:17
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up