Is this site worth $3 to you? If so, please do donate. Any amount is appreciated. Thanks!

CSS first-letter Example

This is a test page for testing what letter is considered “first-letter” by your browser. For context, please see: What's a Letter in CSS's first-letter Pseudo-element?.

For each line in the following, their html is like this:

<div class="tt7654">x LATIN SMALL LETTER X (Letter, Lowercase)</div>

The css is like this:

div.tt7654:first-letter {font-size:xx-large; color:red}

Your browser is supposed to render the first letter large and red.

What Your Browser Shows

x LATIN SMALL LETTER X (Letter, Lowercase)

ψ GREEK SMALL LETTER PSI (Letter, Lowercase)

∑ N-ARY SUMMATION (Symbol, Math)

★ BLACK STAR (Symbol, Other)

3 DIGIT THREE (Number, Decimal Digit)

+ PLUS SIGN (Symbol, Math)

“LEFT DOUBLE QUOTATION MARK” (Punctuation, Initial quote)

"QUOTATION MARK" (Punctuation, Other)

杀 <CJK Ideograph> (Letter, Other)

「LEFT CORNER BRACKET」 (Punctuation, Open) Common Chinese quotation.

Firefox 3.5 Behavior

Here's what Firefox 3.5. shows:

In all major browsers (IE, Safari, Opera) of latest stable release as of 2009-07-28, all the first glyph are rendered large and red, regardless whether it is technically a letter.

Home

About

Advertise

2009-07-28