Web Design All-in-One For Dummies, 2nd Edition
Book image
Explore Book Buy On Amazon

By default, all HTML tags in Cascading Style Sheets (CSS), are structurally preformatted to look a particular way and perform specific functions. Take the

tag, for example. This tag is preformatted to be big, black, and bold, and it is intended to identify the main heading within the text, as opposed to the regular text, which is marked up with

tags in the content.

When you create a tag redefine style, you use the tag name as the selector name to overwrite the preformatted look of any existing HTML tag, such as



The tag redefine style can be changed to anything you like, such as tailoring the default look of all content between

tags to match the design and color scheme of your site, whether that be Impact, 28 pixels, bold, italic, and #000000 or Palatino Linotype, 32 pixels, bold, and #FF99FF:

h1 {
 font-family: Palatino Linotype, Book Antiqua, Palatino, serif;
 font-size: 32px;
 font-weight: bold;
 color: #FF99FF;

Redefining existing tags is one of the best ways to globally style content on a site without having to selectively apply the styles here and there, as you must with custom class styles. In fact, to streamline the CSS process, most designers at a minimum begin each CSS file by creating tag redefine styles for the ,



    1. , and tags.

      A tag redefine style for the tag, for instance, can take on many of the attributes that were formerly applied to the opening tag in HTML code, such as the default page margin spacing and page background color.

      In addition to modifying a tag’s preformatted styles, tag redefine styles can also be used to add new styles to a particular tag. For example, all web pages, unless otherwise specified, have a default 9-pixel margin of space between the edge of the browser window and its contents.


      To remove or change this setting, the margin attribute may be redefined in the body tag. The illustration shows an example of how a style for the tag might be redefined in the CSS, where the margin spacing is set to 0 on all four sides of the browser window, the background color of the page is set to black, and the font color for text within the body is set to white, as in the following style code:

      body {
       margin: 0px;
       background-color: #000000;
       color: #ffffff;

About This Article

This article is from the book:

About the book author:

Sue Jenkins is a working designer as well as a design trainer and author. Her design firm, Luckychair, provides design services for web, logo, and print. Sue has also created a series of training DVDs on popular Adobe design tools including Photoshop, Dreamweaver, and Illustrator.

This article can be found in the category: