使用CSS的Drop-caps

Question

如何使每个段落的第一个字符看起来像这样：

我更喜欢只使用CSS。

Answer 1

p:first-letter {
    float: left;
    font-size: 5em;
    line-height: 0.5em;
    padding-bottom: 0.05em;
    padding-top: 0.2em;
}

根据需要调整字体，填充，行高。

示例：http://jsfiddle.net/RLdw2/

Answer 2

添加此p:first-letter{font-size:50px}

<强> DEMO

---

以下是图片中显示的要求的确切解决方案

DEMO 2

<强> WIKIPEDIA EXPLANATION

Answer 3

see DEMO here...

CSS ///

p{ width:300px; border:1px solid #000;}
p:first-letter
{font-size:52px;color:#8A2BE2;font-weight:bold;float: left;margin-top:4px;}

HTML ///

<p>The first character of this paragraph will be 52px big
as defined in the CSS rule above. Rest of the
characters in this paragraph will remain normal. This example 
shows how to use :first-letter pseduo element to give effect to
the first characters  of any HTML element.</p>


<p>The first character of this paragraph will be 52px big
as defined in the CSS rule above. Rest of the
characters in this paragraph will remain normal. This example 
shows how to use :first-letter pseduo element to give effect to
the first characters  of any HTML element.</p>