Magic HTML Writer

Screen Shots / Cascading Style Sheets

• This version of Magic HTML Writer supports Cascading Style Sheets (CSS). CSS allows a higher degree of precision control over the appearance of your web pages than ordinary HTML.
• It is assumed that the user already has a basic knowledge of the syntax and usage of CSS. However, those with only an introductory knowledge will find that the tools included in Magic HTML Writer will allow them to program like a pro.
• At the time of writing, style sheets are at least partially supported by Microsoft Internet Explorer 3 upwards, Netscape Navigator 4 upwards, Opera 3.5 upwards, W3C's Amaya and many UNIX based browsers.
• Tools included in Magic HTML Writer are:
  • The CSS Builder for Fonts and Text Properties
  • The CSS Builder for Body and Background Properties
  • The CSS Builder for Box Properties
  • The CSS Builder for Scrollbar Properties
  • Not shown here: CSS Builders for Lists, Positioning, and Printing Properties
  • The Link To Style Sheet Code Generator
• Compatibility Considerations
• Units and Values
  • First of all, whenever numerical units or percentages are included in the drop-down box beside a style, those values are only provided as samples to get you started. If you only see "1px" and "5px" but you want "3px", then pick one and change it, or just type in your value.
  • Supported units are:
    • px (pixels)
    • % (percentage)
    • em (height of the element's font)
    • ex (height of the letter "x", doesn't work for all browsers)
    • in (inches, 1 in = 2.54 cm)
    • cm (centimeters)
    • mm (millimeters)
    • pt (points, 1 pt = 1/72 inches)
    • pc (picas, 1 pc = 12 points)
  • Colors
    • Color names can be used instead of the regular HTML 6-digit hexadecimal values. Although only a few are included in the pull-down lists, Magic HTML Writer will recognize the 140 different color names listed in Microsoft's HTML Help Workshop.
    • In addition, CSS supports the RGB function familiar to Visual Basic programmers. Values can be integers 0 to 255, or percentages 0% to 100%. Samples of orange (#FF4000) are:
      • rgb(255,64,0)
      • rgb(100%,25%,0%)
• Pseudo-Classes
  • According to the CSS documentation, pseudo-classes may be listed beside certain HTML markups, separated by a colon (:), in order to enhance their effects.
    Sample:
    a:hover {
        color : red;
    }
    
    • Used with the anchor tag <a>:
      • hover
      • active
      • link
      • visited
    • Used with certain blocking markups including <p>, <li>, <div> and <span>:
      • first-letter
      • first-line
• Resources
  • The W3C website.
  • The Jalfrezi websites.