Hi Yukka,
Thanks for your reply. This looks interesting. I didn't consider this
possiblity. Bruno's implementation is much closer to what our users
were going for, but your technique could be an alternative, if I can
convince them. The main problem is that our users would like whatever
font they choose to be shown to all visitors of their site, and that
pretty much pushes the implementation towards sIFR and similar
Flash-based techniques.
Thanks for your response as well.
--Stephen
---------- Forwarded message ----------
From: "Jukka K. Korpela" <jkorp...@cs.tut.fi>
To: "CSS-D" <css-d@lists.css-discuss.org>
Date: Mon, 18 May 2009 18:41:57 +0300
Subject: Re: [css-d] Displaying/Simulating "handwritten" fonts on notebook paper
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/
