Preparing the HTML for Styling
In the last chapter, you created a stylesheet called styles.css, and in this chapter you will add a number of CSS styling rules to it. But before you get started adding styles, you need to set up your HTML with targets for your styling rules to refer to.
You are going to add class attributes identifying the span elements with the otters’ names as “thumbnail titles.”
class attributes are a way to identify a group of HTML elements, usually for styling.
Your “thumbnail title” class will allow you to easily style all the names at once.
In index.html, add the class name thumbnail-title as an attribute of the
spans inside the li elements, as shown:
... <ul> <li> <a href="#"> <img src="img/otter1.jpg" alt="Barry ...
Get Front-End Web Development: The Big Nerd Ranch Guide now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.
