Stylesheets - CSS styles for Asian IDEOGRAPHS (was Re: and how about blockquote?)

Author

CSS styles for Asian IDEOGRAPHS (was Re: and how about blockquote?)

Zhang Weiwu

2007-01-27, 11:02 pm

于 Tue, 23 Jan 2007 02:05:57 -0600，Ben C写到：

> On 2007-01-23, Zhang Weiwu <zhangweiwu@realss.com> wrote:
[snip]
>
> Do you mean set all occurrences of a given ideograph some colour
> (without having to put a span around each occurrence)?

No, I mean setting background image for each ideograph but omit Latin text
and puncuations. I'll give you an example here:
gopher://sdf.lonestar.org/I/users/w...h_emphasise.png

Please note this is used mainly for artists to use CSS to apply the kind
of ideograph emphasise. The typical Chinese text (ideograph) emphasize
is not applied on the whole sentence but only ideographs on it. They
cannot simply use a background image for the whole <em> section because:
1. The artist is not sure how wide an ideograph is displayed, thus
difficult to design a repeated background image that happen to properly
fit;
2. English text and puncuations are not full ideograph-wide, thus a
repeated background image will not look nice after first Latin alphabetic
or puncuation.

The 'ideograph-background' css style for artist to apply any kind of
emphasize to ideographs is not the most urgently needed one, most urgently
needed is a simple css style that puts a big dot underneath each
ideograph, perferablly possible to specify a color different then the font
color. like '

em {
font-style: normal; /* there is no italic style in Asian typography */
ideograph-emphasize: under-dotted thick red;
}

or this:

em {
font-style: normal; /* there is no italic style in Asian typography */
ideograph-emphasize-style: under-circled;
ideograph-emphasize-thickness: medium;
}

This would be the best:

em {
font-style: normal; /* there is no italic style in Asian typography */
/* this puts the background image on each single ideograph */
ideograph-emphasize-image: url(stroked_circle_emphasize.png);
}

>
> Wouldn't this last one come down to using a font that supported it?
>
>
> What about vertical text-flow? CSS supports rtl and bidi, but not for
> top-to-bottom right-to-left.

The most needed would be "top-to-bottom, right-to-left" for displaying
historical documents. "right-to-left, top to bottom" is un-readable to
Chinese. If I didn't make it wrong Microsoft IE is the first browser on the
earth that can do this and still the only one until now. Glad they still
did some improvements even after they took the whole market, but I'd
prefer seeing Firefox did it. I worked on a lot of historical documents in
college, after college I switched to Linux and all my webpages ruined on
my Linux web browser (Firefox). It's a price to pay to swich to Linux.

Chinese people only have started to write left-to-right, top-to-bottom
not more then 100 years. They wrote top-to-bottom then right-to-left for
the rest of 3000 years.

Ben C

2007-01-27, 11:02 pm

On 2007-01-24, Zhang Weiwu <zhangweiwu@realss.com> wrote:
> ? Tue, 23 Jan 2007 02:05:57 -0600?Ben C???
[snip]
>
> No, I mean setting background image for each ideograph but omit Latin text
> and puncuations. I'll give you an example here:
> gopher://sdf.lonestar.org/I/users/w...h_emphasise.png
>
> Please note this is used mainly for artists to use CSS to apply the kind
> of ideograph emphasise. The typical Chinese text (ideograph) emphasize
> is not applied on the whole sentence but only ideographs on it. They
> cannot simply use a background image for the whole <em> section because:
> 1. The artist is not sure how wide an ideograph is displayed, thus
> difficult to design a repeated background image that happen to properly
> fit;
> 2. English text and puncuations are not full ideograph-wide, thus a
> repeated background image will not look nice after first Latin alphabetic
> or puncuation.
>
> The 'ideograph-background' css style for artist to apply any kind of
> emphasize to ideographs is not the most urgently needed one, most urgently
> needed is a simple css style that puts a big dot underneath each
> ideograph, perferablly possible to specify a color different then the font
> color. like '
>
> em {
> font-style: normal; /* there is no italic style in Asian typography */
> ideograph-emphasize: under-dotted thick red;
> }
>
> or this:
>
> em {
> font-style: normal; /* there is no italic style in Asian typography */
> ideograph-emphasize-style: under-circled;
> ideograph-emphasize-thickness: medium;
> }
>
> This would be the best:
>
> em {
> font-style: normal; /* there is no italic style in Asian typography */
> /* this puts the background image on each single ideograph */
> ideograph-emphasize-image: url(stroked_circle_emphasize.png);
> }

Another way to do it would be some kind of pseudo-selector based on
Unicode character class. That would be more general-- ideograph is one
class of character used in Asian languages, but Unicode defines many.

Then you'd select a background-image based on character class, and
perhaps some new background-position rules to get the proper positioning
of the images under each glyph.

[snip]
>
> The most needed would be "top-to-bottom, right-to-left" for displaying
> historical documents. "right-to-left, top to bottom" is un-readable to
> Chinese. If I didn't make it wrong Microsoft IE is the first browser on the
> earth that can do this and still the only one until now.

I didn't know IE could ever do that.

> Glad they still
> did some improvements even after they took the whole market, but I'd
> prefer seeing Firefox did it. I worked on a lot of historical documents in
> college, after college I switched to Linux and all my webpages ruined on
> my Linux web browser (Firefox). It's a price to pay to swich to Linux.
>
> Chinese people only have started to write left-to-right, top-to-bottom
> not more then 100 years. They wrote top-to-bottom then right-to-left for
> the rest of 3000 years.

I did think it was more natural. It would require turning the CSS box
model on its side-- for most normal-flow elements height would be known
before descendents were formatted and width afterwards (the other way
around from normal CSS) and floats would presumably float up and down
rather than left and right.