Делаем красивую заглавную букву

Делаем красивую заглавную букву
 Недавно я устанавливала шаблон на новый сайт 
http://awto-v-kredit.ru/ и мне особенно понравилось, как в нем выводится первая заглавная буква в абзаце. 
А делается это очень просто. Достаточно добавить в Ваш файл CSS следующие строки для псевдоэлемента :first-letter

CSS:

Code.entry-content > p:first-child::first-letter {
font-size: 3em;
float: left;
background: #555 url(https://awto-v-kredit.ru/wp-content/themes/the-erudite/images/stripes.png) repeat;
color: white;
margin: .05em .1em 0 0;
padding: .1em;
line-height: .7em;
}

HTML-код:

Code
<div class=»entry-content»>
<p>Первый абзац</p>
<p>Второй абзац</p>
<p>Третий абзац</p>
</div>

Результат:

Первый абзац

Второй абзац

Третий абзац

p:first-child::first-letter — означает, что все свойства ниже будут применены только к первой букве первого абзаца в блоке с классом entry-content.
Все остальное, я думаю ясно: размер шрифта, фон и отступы.
Таким образом, Вы можете задать любой фон для первой буквы в первом абзаце, размер шрифта и его стиль.
Пробуйте и отписывайтесь о результатах. Интересно посмотреть, что у Вас получится.