Join Laurie Burruss for an in-depth discussion in this video Creating and styling compound tags, part of Creating a CSS Style Guide: Hands-On Training.
- View Offline
We have made lots of styles for our page. We have made styles for HTML tags,…styles for classes. Remember classes can be used throughout the page as many…times as you want. We have made styles for IDs. IDs can be used only once.…Typically they are used for content areas and for layout areas.…There is another way of creating styles that is very important. It's called…compound styles. You can put a number of tags together or a combination of IDs…and tags together. What this allows you to do is style multiple tags all at the…same time and apply them very quickly and efficiently.…
So we are going to create a compound tag. In fact, we're going to create two of them. …Let's move over to the CSS panel, select New CSS Rule. At the top…it already displays Compound, but this is not what we want to style. At this point…we would like to style our body text and our list. To type this, we put in the…tags p, ul for the Unordered List, ol, dl. So that's all of our body text and…all three of our lists. Again, we will save it into our external style sheet…
Download the exercise files from the Exercise Files tab.
- Planning a site from a blank file
- Creating and editing a style guide with just HTML
- Using the Property Inspector for text markup
- Inserting images, tables, and footers for a custom look
- Creating and editing an external CSS style sheet
- Building a custom color palette for a site
- Testing web pages in various browsers
- Styling tips for professional sites