Time for action — styling the horizontal rules

  1. Open the Style Sheet dialog.
  2. Type the following code below what's already there:
    hr { color: #XXXXXX; }

    Note

    I've posted the code at http://www.officeliveguide.com/customstyles.aspx if you want to just copy and paste it.

  3. Carefully replace #XXXXXX with the color code of your choice. For my website, it is #333399, which is what you see on the companion website.
  4. Save your work and preview your website. Every horizontal rule on your site should now have the color that you assigned rather than the default grey.
  5. Close the preview window and return to Site Designer.

Note

You can do quite a few little things with styles. You can change the color of navigation links, for example, or change the way that bullets in a bulleted list look. I've posted a list at http://www.officeliveguide.com/customstyles.aspx. I'll be updating it from time to time. So, I encourage you to look it up once in a while.

What just happened?

You styled the horizontal rules on your website. They will now appear as pretty solid lines of the color of your choice, instead of their default grey. As with the pictures, the style changes the color of all horizontal rules on the site; not just one.

Pop quiz 8.2

  1. Which of the following is NOT a valid hexadecimal color code?

    A. #ffffff

    B. #A0b0c0

    C. #aaaggg

    D. #999999

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
13.58.197.26