ZorNet.Ru — сайт для вебмастера » HTML и CSS » Фоновое изображение текста при помощи CSS3

Фоновое изображение текста при помощи CSS3

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

Теперь не нужно выбирать какой то оттенок, что будет в одной гамме, а сделать все по одному снимку. Данный пример показывает, что текст теперь можно выставлять при любой формаций изображение, что устанавливается в стилях. Безусловно здесь еще самостоятельно можно его преобразить по стилю, как видите, но изначально все задается по умолчанию, что потом уже можно добавить для изменение.

Приступаем к установке:

HTML

Код
<div class="zornet_ru_dsamen"><a href="http://zornet.ru">ZORNET.RU</a></div>

CSS

Код
.zornet_ru_dsamen {
  background: url(http://zornet.ru/Aben/ABGDA/zornet_ru/7.jpg) -75px -75px;
  color: #f71212;
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  font-weight: bold;
  font-size: 98px;
  font-family: arial, helvetica;
  margin: 47px auto;
  text-align: center;
}

body{
  background: #1d1e1f;
}


Все настройки, как по визуальности и размеру в CSS ставим.

Демонстрация
18 Марта 2018 Просмотров: 1144 Комментариев: (0)

Поделиться в социальных сетях

Материал разместил

Оставь свой отзыв

Комментарии: 0
avatar