As always, RTFM is generally a good place to start. :-D Thus spake the docs for the beloved CGI.pm:

LIMITED SUPPORT FOR CASCADING STYLE SHEETS

CGI.pm has limited support for HTML3's cascading style sheets (css). To incorporate a stylesheet into your document, pass the start_html() method a -style parameter. The value of this parameter may be a scalar, in which case it is incorporated directly into a <STYLE> section, or it may be a hash reference. In the latter case you should provide the hash with one or more of -src or -code. -src points to a URL where an externally-defined stylesheet can be found. -code points to a scalar value to be incorporated into a <STYLE> section. Style definitions in -code override similarly-named ones in -src, hence the name "cascading."

You may also specify the type of the stylesheet by adding the optional -type parameter to the hash pointed to by -style. If not specified, the style defaults to 'text/css'.

To refer to a style within the body of your document, add the -class parameter to any HTML element:

           print h1({-class=>'Fancy'},'Welcome to the Party');
[download]

Or define styles on the fly with the -style parameter:

           print h1({-style=>'Color: red;'},'Welcome to Hell');
[download]

You may also use the new span() element to apply a style to a section of text:

           print span({-style=>'Color: red;'},
                      h1('Welcome to Hell'),
                      "Where did that handbasket get to?"
                      );
[download]

Note that you must import the ":html3" definitions to have the span() method available. Here's a quick and dirty example of using CSS's. See the CSS specification at http://www.w3.org/pub/WWW/TR/Wd-css-1.html for more information.

           use CGI qw/:standard :html3/;

           #here's a stylesheet incorporated directly into the page
           $newStyle=<<END;
           <!--
           P.Tip {
               margin-right: 50pt;
               margin-left: 50pt;
               color: red;
           }
           P.Alert {
               font-size: 30pt;
               font-family: sans-serif;
             color: red;
           }
           -->
           END
           print header();
           print start_html( -title=>'CGI with Style',
                             -style=>{-src=>'http://www.capricorn.com/
+style/st1.css',
                                      -code=>$newStyle}
                            );
           print h1('CGI with Style'),
                 p({-class=>'Tip'},
                   "Better read the cascading style sheet spec before 
+playing with this!"),
                 span({-style=>'color: magenta'},
                      "Look Mom, no hands!",
                      p(),
                      "Whooo wee!"
                      );
           print end_html;
[download]

Gary Blackburn
Trained Killer

---

---

Posts are HTML formatted. Put <p> </p> tags around your paragraphs. Put <code> </code> tags around your code and data!

Titles consisting of a single word are discouraged, and in most cases are disallowed outright.

Read Where should I post X? if you're not absolutely sure you're posting in the right place.

Please read these before you post! —

• How do I compose an effective node title?
• How do I post a question effectively?
• Markup in the Monastery

Posts may use any of the Perl Monks Approved HTML tags:

a, abbr, b, big, blockquote, br, caption, center, col, colgroup, dd, del, details, div, dl, dt, em, font, h1, h2, h3, h4, h5, h6, hr, i, ins, li, ol, p, pre, readmore, small, span, spoiler, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, tr, tt, u, ul, wbr

You may need to use entities for some characters, as follows. (Exception: Within code tags, you can put the characters literally.)

	For:		Use:
	&		&
	<		&lt;
	>		&gt;
	[		&#91;
	]		&#93;

Link using PerlMonks shortcuts! What shortcuts can I use for linking?

See Writeup Formatting Tips and other pages linked from there for more info.