Подробное описание и демонстрация работы блока «Эффекты для текста» для сайта под номером №19 для библиотеки Bootstrap. Html и CSS код для текстовых эффектов на сайте как на изображении.
Fokit.ru
.demo{ background-color: #056608; } .text-effect { color: #139617; font-family: 'Iceland', cursive; font-size: 120px; font-weight: 800; text-align: center; display: block; animation: effect 1.5s ease-in-out infinite alternate; } @keyframes effect{ from{ color: #fff; text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #60c463, 0 0 70px #60c463, 0 0 80px #60c463, 0 0 100px #60c463, 0 0 150px #60c463; } to{ color: #139617; text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #60c463, 0 0 35px #60c463, 0 0 40px #60c463, 0 0 50px #60c463, 0 0 75px #60c463; } } @media only screen and (max-width: 990px){ .text-effect{ font-size: 80px; } } @media only screen and (max-width: 767px){ .text-effect{ font-size: 55px; } } @media only screen and (max-width: 479px){ .text-effect{ font-size: 40px; } } @media only screen and (max-width: 359px){ .text-effect{ font-size: 35px; } }
<div class="demo"> <span class="text-effect">Best jQuery</span> </div>html разметка и css стили для реализации блока «Эффекты для текста»