Несколько вариантов красивого оформления текста.


Доброго времени суток всем, кто читает шпаргалки блогерши. Совсем недавно мы оформляли текст с эффектом неонового свечения. В продолжении этой темы рассмотрим ещё несколько вариантов. И конечно, как их реализовать у себя на блоге.
Всё, что будет предложено, можно использовать для отдельного участка текста, так и для заголовков.

Как красиво оформить текст в сообщении блога. 


1. Просто необычный текст. Меняйте  размер 45 и цвет текста 00FFFF  на своё усмотрение 
здесь будет ваш текст.
код

<div style="width:100%;filter:glow(color:00FFFF Strength=5);font-family:Monotype Corsiva;font-size:45pt;color:Blue  ;">здесь будет ваш текст.</div>

2. Здесь просто добавили свойство text-shadow. В результате получили эффект тени. -  text-shadow: 4px 3px 0px #B2AFBA, 9px 8px 0px rgba(0,0,0,0.15); Все значения цвета и размер тени можно менять на свои.
здесь будет ваш текст.

   код

<div style="width:100%;filter:glow(color:00FFFF Strength=5);font-family:Monotype Corsiva;font-size:45pt;color:Blue ;text-shadow: 4px 3px 0px #B2AFBA, 9px 8px 0px rgba(0,0,0,0.15); ">здесь будет ваш текст.</div>

3. Немного опять добавили параметров . Все значения можно менять на свои.

здесь будет ваш текст.

код

<div style="width:100%;filter:glow(color:00FFFF Strength=5);font-family:Monotype Corsiva;font-size:45pt;color:Blue ;text-shadow: 0px 3px 0px #85636C,0px 14px 10px rgba(0,0,0,0.15), 0px 24px 2px rgba(0,0,0,0.1), 0px 34px 30px rgba(0,0,0,0.1);">здесь будет ваш текст.</div>

4. А это почти 3D эффект.

здесь будет ваш текст.


<div style="width:100%;filter:glow(color:00FFFF Strength=5);font-family:Monotype Corsiva;font-size:45pt;color:Blue ;text-shadow: 0 1px 0 #ccc,0 2px 0 #c9c9c9,0 3px 0 #bbb, 0 4px 0 #b9b9b9,0 5px 0 #aaa,0 6px 1px rgba(0,0,0,.1), 0 0 5px rgba(0,0,0,.1),0 1px 3px rgba(0,0,0,.3),0 3px 5px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.2),  0 20px 20px rgba(0,0,0,.15);">здесь будет ваш текст.</div>


Ну с тенями вдоволь наигрались. Можно делать до бесконечности. Предложу ещё код. Мы получим эффект наложения текста. Вот, что-то такое


оформим красиво текст
как-то вот так


<center>
<span style="color: #bf2799; font-family: Impact; font-size: 45px; line-height: 0px;">оформим красиво текст<br /><span style="color: #7fc067; font-family: Comic Sans; font-size: 65px;">как-то вот так</span></span></center>


 То, что выделено синим это текст заднего плана. Красным -текст переднего плана. Соответственно можно устанавливать любой цвет #bf2799,color: #7fc067, и 45px,65px.
Выглядеть это будет уже  по другому. Вот что получилось после некоторых изменений этих параметров.


очень красиво
оформим заголовок

Бегущая строка в сообщении
здесь ваш текст

 код

<div align="center" style="filter: Shadow(color=Pink , direction=100, strength=10); width: 100%;">
<marquee><span style="color: #4ABF32; font-family: Verdana, sans-serif; font-size: large;">здесь ваш текст</span></marquee></div>


Теперь, когда вы выбрали подходящее оформление просто копируйте код и при написании сообщения, перейдите из режима создать в режим HTML. И в том месте, где вы хотите видеть выделенный текст вставляем его. И возвращаемся обратно. Советую, если будете менять значения на свои делайте это сначала в блокноте или черновике.
А как сделать тень для блока можно прочитать здесь.
На этом, пожалуй всё на сегодня. Хороших всем выходных.

Удачи всем нам.
Ой, а что это там ниже?  


хотите оформить подписку на новые шпаргалки

введите пожалуйста свой email :

9 комментариев:

  1. Нарядненько получается))) Возьму на заметку для особых случаев. Вика, спасибо!

    ОтветитьУдалить
  2. Ирина, привет. Я с этими кодами до бесконечности могу играться. Сейчас вот пока непогодь у нас вот и вытворяла. Обращайся если что.

    ОтветитьУдалить
  3. Ну, тогда спасибо непогоде за такую красоту. Обращусь, не сомневайся)))

    ОтветитьУдалить
  4. Виктория, спасибо, очень необходимо. Сделала, получилось красиво.

    ОтветитьУдалить
  5. Девчонки, вам спасибо и всем моим читателям. Ирина, на следующей неделе опять в кадр ко мне попадёшь. Татьяна, забегу посмотреть обязательно.

    ОтветитьУдалить
  6. Шо, опять? Где я уже опять успела провиниться)))

    ОтветитьУдалить
  7. А где так оформляли? а код менять в сообщении или в хтмле-блога?

    ОтветитьУдалить
    Ответы
    1. free-dom-777 вот цитата из этого сообщения. Это делактся в редакторе сообщений. "Теперь, когда вы выбрали подходящее оформление просто копируйте код и при написании сообщения, перейдите из режима создать в режим HTML. И в том месте, где вы хотите видеть выделенный текст вставляем его. И возвращаемся обратно. Советую, если будете менять значения на свои делайте это сначала в блокноте или черновике."

      Удалить

Пользовательский поиск
Foto Saya
My Photo