3D текст

Пример 3D текста

 

Для того, чтобы вставить заголовок с 3D текстом, сделайте следующее:

1. Откройте страницу на редактирование: если страница HTML, то любым HTML-редактором или даже блокнотом. Если ваш сайт работает на движке (например WordPress) под своим пользователем нажмите кнопку "Редактировать" и перейдите со вкладки "Визуально" на вкладку "HTML".

2. Найдите то место на странице, куда вы хотели бы установить таймер.

3. Вставьте  HTML-код :

    <style type="text/css">
body{background: white; font-family: "Georgia"; text-align: center;}
     h12{margin: 0.3em 0 0; color:
Red; font-size: 50px; text-shadow: 0 1px 0 Black, 0 2px 0 #c9c9c9, 0 3px 0 #bbbbbb, 0 4px 0 #b9b9b9,
     0 5px 0 #aaaaaa, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.3), 0 3px 5px rgba(0, 0, 0, 0.2),
     0 5px 10px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.2), 0 20px 20px rgba(0, 0, 0, 0.15);}    </style>

И далее строку:
    <h12 style="text-align: center;">Пример 3D текста</h12>

в результате отобразится:

Пример 3D текста

4. сохраните страницу (для WordPress кнопка обновить).

5. смотрите результат в браузере. 

 

Что можно изменить:​

​В Коде стиля красным цветом подсвечено  …color: Red; font-size: 50px; … соответственно цвет заголовка и его размер

В строке <h12 style="text-align: center;">Пример 3D текста</h12> красным цветом сам текст заголовка.

Если вы на одной странице хотите использовать несколько одинакового формата заголовков, просто в нужном месте вставляйте в HTML формате строку с Другим заголовком:

<h12 style="text-align: center;">Другой заголовок красного цвета.</h12>

Другой заголовок красного цвета.

 

Ну и если Вам нужно вставить на одной странице заголовок другого цвета и размера вставляем:

этот блок отличается от предидущего кодом:  h13 

    <style type="text/css">
body{background: white; font-family: "Georgia"; text-align: center;}
     h13{margin: 0.3em 0 0; color: Blue
; font-size: 70px; text-shadow: 0 1px 0 Black, 0 2px 0 #c9c9c9, 0 3px 0 #bbbbbb, 0 4px 0 #b9b9b9,
     0 5px 0 #aaaaaa, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.3), 0 3px 5px rgba(0, 0, 0, 0.2),
     0 5px 10px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.2), 0 20px 20px rgba(0, 0, 0, 0.15);}    </style>

И далее строку (размер 70):
    <h13 style="text-align: center;">Заголовок синего цвета.</h13>

 

Заголовок синего цвета.

 

 

Пробуйте, внедряйте, успехов Вам в сайтостроении.

 

Поделиться в соц. сетях

Опубликовать в Google Buzz
Опубликовать в Google Plus
Опубликовать в LiveJournal
Опубликовать в Мой Мир
Опубликовать в Одноклассники
Опубликовать в Яндекс