Microsoft HomeproductssearchsupportshopWrite Us   Microsoft Home
Magazine
 |  Community
 |  Workshop
 |  Tools & Samples
 |  Training
 |  Site Info

Design Home Page Design and Layout
Style Sheets
Design and Layout >
Color Management *
Creative Materials *
Calendar of Events *
Interviews with Experts *
Typography *
Relevant Links *
Style Sheets
Style Sheets
Style Sheets

July 3, 1996

Nadja Vol Ochs
Interactive Media Designer, Microsoft Corporation

Download Microsoft Word (.DOC) format of this document (zipped, 23.2K)

 

Have you ever had to go through pages and pages of HTML to make changes to fonts, color selections, or layout? Are you interested in having more control over the layout and design of your Web site? Style sheets enable you to control the formatting and typographical layout of your pages with style and efficiency.

Style sheets, a new World Wide Web Consortium (W3C) feature supported by Microsoft® Internet Explorer 3.0, provides additional formatting options and better control over the HTML tags on your Web pages. If you know how to implement styles and formatting in desktop publishing, you'll appreciate similar capabilities for designing on the Web. You can now control such things as leading, margins, indents, typefaces, colors, and much more.

Style sheets allow you to separate the style and layout of your HTML files from their informational content. With style sheets, you can make all of your HTML layout and formatting changes in one location, either in a separate file or at the top of each HTML page. You will never have to touch every single line of HTML again.

Take a look at some of the enhancements you can add to your HTML pages using style sheets. The sample paragraphs below are positioned on the page within a borderless, non-scrolling, inline frame. (To view the style sheet code, right-click inside the paragraph and select View Source from the pop-up menu.)

Note: These examples require Internet Explorer 3.0 or later. If you're using Netscape® Navigator® clicking the images will open a new browser window (in Internet Explorer 2.0, the examples will replace this page), and you won't be able to see the effect of the style sheets we used in the examples.

Hand 1Paragraph 1... Hand 2Paragraph 2... Hand 3Paragraph 3...

For a more detailed example of style sheets, take a look at the HTML source for this page.

Style sheets provide an efficient way to save design time and editorial effort. If you know HTML and some basic desktop publishing terminology, you are prepared to begin implementing style sheets on your Web site today. To learn how to use style sheets on your Web site, see the articles and specs below:




Photo Credit: Nick Koudis/PhotoDisc; Neil Beer/PhotoDisc


Did you find this article useful? Gripes? Compliments? Suggestions for other articles? Write us!

Back to topBack to top

© 1998 Microsoft Corporation. All rights reserved. Terms of use.

 

Magazine Home
Ask Jane
DHTML Dude
Extreme XML
For Starters
More or Hess
Servin' It Up
Site Lights
Web Men Talking
Member Community Home
Benefits: Freebies & Discounts
Benefits: Promote Your Site
Benefits: Connect with Your Peers
Benefits at a Glance
Online Special-Interest Groups
Your Membership
SBN Stores
Join Now
Workshop Home
Essentials
Content & Component Delivery
Component Development
Data Access & Databases
Design
DHTML, HTML & CSS
Extensible Markup Language (XML)
Languages & Development Tools
Messaging & Collaboration
Networking, Protocols & Data Formats
Reusing Browser Technology
Security & Cryptography
Server Technologies
Streaming & Interactive Media
Web Content Management
Workshop Index
Tools & Samples Home
Tools
Samples, Headers, Libs
Images
Sounds
Style Sheets
Web Fonts
Training Home
SBN Live Seminars
SBN Live Chats
Courses
Peer Support
CD-ROM Training
Books & Training Kits
Certification
SBN Home
New to SBN?
What's New on SBN
Site Map
Site Search
Glossary
Write Us
About This Site