A Closer Look at CSS
Learn how to style text and add background images with CSS.
StartA Closer Look at CSS
Lesson 1 of 1
- 1CSS 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…
- 2Take 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…
- 3Awesome 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: …
- 4One 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: h1 { font-family: Georgia, serif; } …
- 6Up 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: Heading …
- 8In CSS, the background-image property sets a background image of your choice for a given selector, as seen below. .hero { background-image: url(“https://content.codecademy.com/projects/make-…
- 9The 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…
- 10Congratulations! 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
How you'll master it
Stress-test your knowledge with quizzes that help commit syntax to memory