Gather Workshops Logo

CSS Basics

Prettifying your page

Background

Let's start by adding a background image to your site.

html {
    background-color: black;
    background-image: url('http://tiny.cc/swirls');
}

Got it working?

Now choose a pattern of your own from Subtle Patterns.

p {
    color: red;
    font-size: 14px;
    line-height: 150%;
}

p {
    color: red;
    font-size: 14px;
    line-height: 150%;

    width: 700px;
    margin: 0 auto;
}

.important {
    color: green;
    font-size: 26px;
    font-weight: bold;
}

<p class="important">
    I love bunny rabbits!
</p>