Яндекс.Метрика

Дизайн-журнал №1. Актуальная информация для дизайнеров, веб дизайнеров, программистов и разработчиков сайтов.

Архив рубрики ‘css’

  • Постоянная ссылка на Использование фона у тега body

    Использование фона у тега body

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

    Далее... 1 Комментарий »
  • Постоянная ссылка на Тонированные изображения с помощью множественных фоновых изображений

    Тонированные изображения с помощью множественных фоновых изображений

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

    Далее... Нет комментариев »
  • Постоянная ссылка на Создание многострочного градиентного фона для текста

    Создание многострочного градиентного фона для текста

    Мы столкнулись с интересной задачей: создать многострочный градиентный фон для текста. Создать текст с фоном уже довольно непросто, а также нам, вероятно, пригодится свойство box-decoration-break (перенос блока оформления). Как оказалось, нам понадобятся еще некоторые приемы, чтобы все сработало.

    Далее... Нет комментариев »
  • Постоянная ссылка на Создание интересных нумерованных списков с помощью CSS

    Создание интересных нумерованных списков с помощью CSS

    Обычные нумерованые списки выглядят очень просто. Конечно, можно использовать фоновые изображения и другие разнообразные способы оформления у обычного нумерованного списка, но при этом не хватает возможностей управления самой цифрой. В этом примере вместо стандартного нумерованного списка создадим собственный.

    Далее... Нет комментариев »
  • Постоянная ссылка на Использование фильтров у фоновых изображений

    Использование фильтров у фоновых изображений

    С помощью свойства фильтра можно довольно легко наложить фильтр на целый элемент. Но что делать, если нужно применить фильтр только к фоновому изображению элемента? Сделать это весьма непросто. Существуют свойства CSS, которые предназначены специально для фоновых изображений, такие как background-blend-mode, но режимы наложения и фильтры — не одно и то же. Создается впечатление, что для этой цели [...]

    Далее... Нет комментариев »
  • Постоянная ссылка на Использование цветовых схем CSS

    Использование цветовых схем CSS

    С появлением возможности выбирать темную цветовую схему в операционной системе MacOS Технологический Анонс Safari 68 объявил о поддержке нового свойства prefers-color-scheme, которое позволяет нам определить с помощью запроса media, включена ли темная цветовая схема у пользователя. Технологический Анонс Safari 71 объявил также о поддержке свойства supported-color-schemes, с помощью которого можно будет задавать поддерживаемые веб-страницей световые схемы.

    Далее... Нет комментариев »
  • Постоянная ссылка на Создание копии движений указателя мыши

    Создание копии движений указателя мыши

    Из этого урока вы узнаете об интересных возможностях кода CSS. Можно создать сетку квадратов из положений указателя мыши. Еще интересней скопировать эту сетку, поместить ее в другом месте экрана, немного изменить ее внешний вид и отображать движения указателя мыши в режиме реального времени.

    Далее... Нет комментариев »
  • Постоянная ссылка на Создание заголовков с линиями по краям

    Создание заголовков с линиями по краям

    Нам стало интересно, как можно сверстать дизайн с большим заголовком и подзаголовком меньшего размера под ним, который бы обрамлялся двойными линиями справа и слева от центрированного текста. Простой путь здесь — использовать изображения, но мы попробуем пойти намного более сложным путем — создадим это с использованием только CSS, в котором сложности возникнут из-за разнообразных свойств текста, таких [...]

    Далее... 1 Комментарий »
  • Постоянная ссылка на Использование связывания объектов

    Использование связывания объектов

    Что такое связывание объектов? Это создание события, которое отражается на другом объекте на веб-странице. При этом событие может отражаться также и на первом объекте. Для создания достаточно использовать только CSS, так что это интересный и нересурсоемкий способ.

    Далее... Нет комментариев »

Страница 2 из 5312345102030...Последняя »