Stephen Tang wrote:

> I encountered a peculiar use case.  The business desires to display a
> small amount of text as a handwritten font.  They want the handwritten
> font sitting on blue lines.  This would simulate the effect of writing
> in a notebook.

You could do something like this:

Markup:

<p class="handwritten"><span class="content">
the text
</span></p>

CSS:

.handwritten {
   font-family: "Monotype Corsiva", cursive;
   text-decoration: underline;
   background: white;
   color: blue;   }
 .handwritten:first-line {
   text-decoration: underline overline; }
.handwritten .content {
   background: transparent;
   color: black; }

Omit the second rule if you just want the text to sit on blue lines, instead 
of looking like written between blue lines.

Unfortunately there's no way to control the vertical placement of the 
underline (and overline).

-- 
Yucca, http://www.cs.tut.fi/~jkorpela/ 

______________________________________________________________________
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to