За красивую заглавную букву, в CSS отвечает псевдо-элемент :first-letter.
Если Вам нужно сделать красивую заглавную букву во всех абзацах статьи, то :first-letter привязывается к селектору p/
Если же красивая заглавная буква нужна только в одном абзаце, то этому абзацу задаётся class, и псевдо-элемент привязывается к этому классу.
Пример:
Код:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<title>Документ без названия</title>
<style>
p:first-letter{
font-family: Monotype Corsiva;
font-size: 200%;
color: #007371;
}
.text:first-letter{
font-family: Impact;
font-size: 200%;
color: #FF0A0A;
}
</style>
</head>
<body>
<p>Хостинг Бегет</p>
<p>Круглосуточная тех. поддержка</p>
<p>Быстрое решение любых проблем с сайтом</p>
<p>Стоимость аренды от 999 руб. в год</p>
<p class="text">1 гиг на диске</p>
</body>
</html>
Думаю, тут всё понятно.
Теперь оформим первую строку абзаца. За неё в CSS отвечает псевдо-элемент first-line.
Принцип действия такой же, как и в предыдущем примере.
Если нужно оформить только одну строку одного абзаца, то этому абзацу задаётся класс. Если же оформлению подлежат первые строки всех абзацев, то псевдо-элемент first-line привязывается к селектору p
Пример:
Код:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<title>Документ без названия</title>
<style>
p:first-line{
font-family: Impact;
font-size: 150%;
color: blue;
}
</style>
</head>
<body>
<p>Хостинг Бегет<<br>
Круглосуточная тех. поддержка<<br>
Быстрое решение любых проблем с сайтом<<br>
Стоимость аренды от 999 руб. в год<<br>
1 гиг на диске</p>
</body>
</html>
Думаю не так уж и сложно 
Итог
