• Страница 1 из 1
  • 1
Форум » Записки веб-разработчика » Начинающему вебмастеру » Сделать красивый текст с тенью на стилях CSS
Сделать красивый текст с тенью на стилях CSS
Kosten
Дата: Воскресенье, 2017-10-29, 15:52 | Сообщение 1
Администраторы
Сообщений:18737
Награды: 55


Полностью на стилях CSS веб мастер может наложить на любой текст красивые тени под редактирование на различные пиксели, что по виртуальность смотреться будет оригинально.



Как можно сделать?

Разметка HTML

Код
<h1 title="Текст с тенью." class="shadowtitle">
      <span>ZorNet: Создание сайта на uCoz</span>
      </h1>


CSS

Код
h1.shadowtitle {
     position:relative;
     height:1em;
    }
    h1.shadowtitle span {
     position:absolute;
     left:-1px;
     top:-1px;
     color:#87B7FE;
    }
    h1.shadowtitle:before {
      content:attr(title);
      position:absolute;
      left:0;
      top:0;
      color:#000;
    }
Прикрепления: 9660129.png(30.5 Kb)
Страна: (RU)
-SAM-
Дата: Вторник, 2017-11-07, 05:24 | Сообщение 2
Друзья сайта
Сообщений:463
Награды: 18


Здесь вот еще написан способ, что в сети наткнулся, как можно красиво стилизовать текст - подход всё тот же, что задается многослойность и тем самым достигается тень или же градиент. Это для старых версий браузеров больше всего, как и есть недостатки - дублируется содержимое в исходный код (подойдёт для коротких заглавий блоков каких-то или же в качестве логотипа). Другое дело, что когда действительно логотип какой или надпись сделать, то можно просто представить это всё в качестве картинки, вот наткнулся был на полезный, как считаю, генератор - cooltext.com (в нём есть поддержка кириллицы, выбор разных стилей оформления и шрифтов, задание тени, есть возможность компоновки нескольких текстов оформленных в одно изображение, например, чтобы потом в качестве лого сохранить - с выбором разных форматов, размеров).

Страна: (UA)
Форум » Записки веб-разработчика » Начинающему вебмастеру » Сделать красивый текст с тенью на стилях CSS
  • Страница 1 из 1
  • 1
Поиск: