How Web Pages Work

3

`That’s it. You can throw in standard color names like “red” or “blue,” or if you need something more specific, use a Hexadecimal code. It’s the same logic you’d use for font colors.### Unordered ListsMost of the time, you’re going to want a bulleted list. In HTML, that’s an unordered list. It starts with `

    ` and ends with `

`. Every single item inside needs the `

  • ` tag (short for List Item).Here is what that looks like in practice:
    • California
    • Oregon
    • North Carolina

    By default, those bullets are discs. But you can change them if you feel like it. Add a `type` attribute to the `

      ` tag.`

        ` gives you circles.
        `

          ` gives you squares.It’s a small detail, but it can make a list look less generic.### Ordered ListsNeed numbers? Use an ordered list. The tags are `

            ` and `

          `. You still use `

        • ` for each item.
          1. oranges
          2. grapes
          3. cherries

          The default is standard numbering (1, 2, 3). But you can switch things up with the `type` attribute.- `type=”A”` uses capital letters (A, B, C).
          – `type=”a”` uses lowercase letters (a, b, c).
          – `type=”I”` uses uppercase Roman numerals (I, II, III).
          – `type=”i”` uses lowercase Roman numerals (i, ii, iii).Want to start the count at a specific number? Say you want the first item to be “6.” You use the `start` attribute on the `

            ` tag and the `value` attribute on the specific `

          1. `.
            1. It’s a bit verbose, but it gives you control over the sequence.### Descriptive ListsThen there are the weird ones. Descriptive lists. They look like a definition list. The first line is flush left. The second line is indented.Marshall Brain Founder of HowStuffWorksTo build this, you wrap everything in `
              ` and “. The label goes in `
              ` (Definition Term). The description goes in `
              ` (Definition Description).Marshall Brain
              Founder of HowStuffWorksThe `
              ` sits on the margin. The `
              ` pushes to the right. It’s a specific structure for pairs of terms and descriptions.Once you have your colors and lists sorted, the next step is connecting it all to other places. Links.