![Еще один способ выделиться Выделяем заглавные буквы заголовков в блоге](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPQuqZ0RMu9VSCAFngZxJNUl7ecgFLXFgFxyRrUV8uY7KCgR8WTbwAgIFm2XKSrtA9kWMv6ESK3z-K5pPubbp97eGe_gHc48-iWpPcyexqswh1Ihhx1tyZySzyRY0-yYWoLSjLzhplj-1L/s200/%25D0%25B7%25D0%25B0%25D0%25B3%25D0%25BB%25D0%25B0%25D0%25B2%25D0%25BD%25D0%25B0%25D1%258F.jpg)
Достигается этот трюк путем добавления в шаблон нескольких строк CSS, после которых все названия статей и виджетов автоматически будут иметь заглавную букву в названии, отличную от других и оформленную оригинальным образом.
Присутствует возможность букве задать собственный цвет, размер, стиль написания и тень.
Дабы читатель имел представление о чем идет речь, привожу примерный вариант развития событий на изображении ниже:
![Выделяем заглавные буквы заголовков в блоге](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgk98wMoEOnryOhY33TiX0z2uVz11ZtpHsDHqY9vS58wT971bmqDJ0zil4K2XPvwDW-4kP-35zmlPCqNLCALPlgc-qrCR70HtqduPkkHrmt00po35280xOLjzdCfTuu80v01jpGOX8cYWj6/s320/zaglavnaya-bukva.png)
Таким образом, посредством одной небольшой правки шаблона вы сможете выделить одновременно все заглавные буквы:
- в названиях сообщений,
- в заголовках у виджетов боковой колонки;
- в подписях даты.
Добавление особого стиля к первой букве заголовков.
Как и прежде, для доступа к HTML-шаблону потребуется совершить знакомый с детства путь: Дизайн > Изменить HTML. Ввиду последних приятных изменений интерфейса Blogger путь этот будет выглядеть: Ваш блог > Шаблон > Изменить HTML.
h2:first-letter {color: #CB941C; font-size: 20px; text-shadow: 0 0 0.1em #BB1818, 0 0 0.1em #BB1818, 0 0 0.1em #BB6006;} h3.post-title:first-letter{color: #CB941C; font-size: 28px; text-shadow: 0 0 0.1em #BB1818, 0 0 0.1em #BB1818, 0 0 0.1em #BB1818;}После выполнения этой тяжкой процедуры остается сохранить шаблон и взглянуть на блог по-новому.
Однако, как упоминалось мною ранее, этот эффект можно полностью настроить по своему собственному эстетическому вкусу, о чем я и укажу ниже:
- color: #CB941C; - определяет цвет самой буквы, изменяется путем замены кода цвета (для его нахождения используйте онлайн-подбор веб-цвета);
- font-size: 18px; (28 px - во втором случае) - означает размеры буквы в названии сообщений и в названии виджетов (подбирается согласно шрифту ваших заголовков);
- text-shadow: 0 0 0.1em #BB1818, 0 0 0.1em #BB1818, 0 0 0.1em #BB1818; - добавляет неоновую тень заглавной букве (подробное совершение изменений здесь смотрите в ранней статье).