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

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

Записи, помеченные ‘урок верстка’

  • Постоянная ссылка на Создание раскладывающейся трехмерной галереи изображений

    Создание раскладывающейся трехмерной галереи изображений

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

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

    Сложных стили для списков со встроенными шрифтами и динамическим содержимым

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

    Далее... 1 Комментарий »
  • Постоянная ссылка на Создание автоматического добавления QR кодов на веб-страницы

    Создание автоматического добавления QR кодов на веб-страницы

    Есть несколько ситуаций, в которых вездесущие QR коды могут быть уместны или даже полезным при печати веб-страниц. В некоторых ситуациях может быть уместно добавить видимый адрес ссылки после слов, с которых происходит ссылка на напечатанной веб-страницы. Хотя это можно сделать, пользователю придется перепечатывать эту ссылку вручную. Если же вместо этого использовать QR код, можно будет просто отсканировать [...]

    Далее... Нет комментариев »
  • Постоянная ссылка на Сильное увеличение изображения с помощью прокрутки HTML5

    Сильное увеличение изображения с помощью прокрутки HTML5

    В этом уроке мы расскажем о довольно простом, но интересном примере использования прокрутки HTML для приближения изображений. При правильно подобранном изображении (как, например в этом уроке) эффект может выглядеть космически. А еще это неплохой инструмент для различных версий онлайн-магазинов, в который важно посмотреть фото товара поближе.

    Далее... Нет комментариев »
  • Постоянная ссылка на Создание дробей с помощью замены на символ из шрифтов OpenType

    Создание дробей с помощью замены на символ из шрифтов OpenType

    Идеальным решением для создания дробей на веб-страницах было бы использование такого шрифта, который бы автоматически создавал правильные дроби из использованных в тексте числителя и знаменателя. Эта возможность автоматически заменять символы присутствует у некоторых шрифтов OpenType.

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

    Создание галереи изображений на чистом CSS

    Мы решили создать свой вариант необычной галереи изображений без использования JavaScript, только с помощью кода CSS. Такая галерея изображений больше всего подходит группе из не более двух десятков изображений. Целью этой галереи является возможность отфильтровать элементы по типу так же, как в настоящей базе данных, только все элементы этой базы данных — изображения.

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

    Создание фонового видео, прокручивающегося вместе с содержимым

    Этот урок родился из другого туториала, в котором было описано создание полноэкранного фонового видео HTML5. Одним из главных вопросов был эффект прокручивания полноэкранного видео, расположенного за содержимым и поднимающегося при прокрутке вверх вместе со всей веб-страницей. Решение в этой ситуации довольно простое: использование расположений CSS месте со стилями, обычно используемыми для растягивающихся изображений. А также [...]

    Далее... 11 Комментариев »
  • Постоянная ссылка на Использование значения свойства CSS ширины по размеру содержимого

    Использование значения свойства CSS ширины по размеру содержимого

    Хотя некоторые новые свойства и значения свойств, такие как object-fit (подходить для объекта), max-content (по максимальному размеру содержимого), min-content (по минимальному размеру содержимого) и fit-content (по ширине содержимого) еще считаются экспериментальными, они уже хорошо поддерживаются браузерами, иногда нуждаясь в добавлении приставок производителей.

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

    Использование свойства CSS перспективы

    Для создания трехмерных трансформаций, правильно работающих на веб-сайтах, нужно использование свойства CSS перспективы, с которым у большинства веб-разработчиков в начале знакомства с трехмерными эффектами CSS могут возникать проблемы. Первое и самое важное — свойство перспективы обычно задается элементам внешних блоков, таким как <body>, <figure> и <div>. Это позволит производить трехмерные преобразования над элементами потомков, такими [...]

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

Страница 5 из 42« Первая...34567102030...Последняя »