A Closer Look at CSS

Learn how to style text and add background images with CSS.

Start[missing "en.views.course_landing_page.make-a-website.course_illustration" translation]
A Closer Look at CSS
Lesson 1 of 1
  1. 1

    CSS is a language used to style websites. Colors, fonts, and page layouts for a site can all be managed using CSS. The more comfortable you are with CSS, the better equipped you will be to create s...

  2. 2

    Take a look at the web browser. Technically, this is the same site you saw in the previous exercise. It contains the exact same HTML elements and content as before. What's missing? The CSS that was...

  3. 3

    Awesome job! Now main.css is linked to index.html. Before we start writing our own CSS, let's take a look at how CSS code works. The diagram to the right shows the anatomy of a CSS rule: ...

  4. 4

    One of the most effective ways to enhance the look and feel of a website is by changing the font. In CSS, font is managed using the font-family property: [...] Above, the [...] property of ...

  5. 5

    The new font looks great! However, black is not your only option when it comes to font color. In CSS, the color property sets the color of a CSS selector's font: [...] CSS comes equipped w...

  6. 6

    Up to this point, we've used CSS to select an HTML element by its tag name only. However, we can use class selectors to target classes of HTML elements. Consider the HTML below: [...] Her...

  7. 7

    The size of text has an impact on how users experience a website. The font-size property sets the size of an HTML element's text. [...] In the CSS above, [...] is set to [...] . In CSS, s...

  8. 8

    In CSS, the background-image property sets a background image of your choice for a given selector, as seen below. [...] The CSS rule above assigns the image hosted at [...] to elements ...

  9. 9

    The background image makes a big difference. Nice work! A previous exercise introduced CSS class selectors to style HTML elements of specific classes. What if a webpage design calls for an indivi...

  10. 10

    Congratulations! You worked hard and made it to the end of a challenging lesson. There were a lot of new concepts, so let's take a moment to review what you've learned.

What you'll create

Portfolio projects that showcase your new skills

Pro Logo

How you'll master it

Stress-test your knowledge with quizzes that help commit syntax to memory

Pro Logo

A Closer Look at CSS

Start[missing "en.views.course_landing_page.make-a-website.course_illustration" translation]