урок верстка - Страница 10

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

Создание эффекта полутонов с использованием SVG

Визуальный эффект полутонов — построение изображения из крошечных цветных точек — легко создать на веб-странице, используя SVG. Способ, показанный здесь, использует значение свойства множественных фоновых изображений у элемента блока: один повторяющийся решетчатый узор, использованный в нашем уроке «Создание фоновых изображений в стиле поп-арт с помощью SVG и режимов наложения», только с меньшим размером решетки, объединенный [...]
Далее... Нет комментариев »
Использование свойства CSS очистки для решения проблемы со всплытием изображений

Хотя проблема со всплытием возникает не только с изображениями, чаще всего она связана именно с ними, так что рассмотрим такую ситуацию. Обычно она возникает, когда несколько изображений всплывают на одной стороне веб-страницы довольно близко друг к другу. В нашем примере изображениям задан класс, который создает подобное расположение изображениям:
Далее... Нет комментариев »
Использование контекстного селектора и селектора прямого потомка в CSS

В этом уроке мы рассмотрим два селектора CSS, которые относятся к родственным селекторам: контекстный селектор и селектор прямого потомка. Селектор прямого потомка используется довольно часто, хотя, возможно, его следовало бы использовать намного чаще. Он выбирает только элементы, которые являются прямыми потомками определенного элемента. Например, у нас есть элемент статьи HTML5, внутри которого находятся элементы абзаца и элемент [...]
Далее... 158 Комментариев »
Полноэкранное фонового видео с текстом в режиме наложения

В этом уроке мы решили попробовать совместить техники из статей о создании фонового видео для веб-страниц и использовании режима наложения смешения для создания автоматически контрастного текста. На веб-сайте о модной обуви Everlane показано такое сочетание, послужившее источником вдохновением для создания этого урока. Код в нашем примере намного проще, чем в статье о создании полноэкранного видео, [...]
Далее... Нет комментариев »
Генератор фоновых узоров SVG из пересекающихся кругов

Мы давно хотели создать генератор фоновых узоров SVG: уже существует много хороших генераторов, но они не используют все богатство возможностей, доступное в этой технологии для создания изображений. То, что Вы видите ниже, — только прототип, показывающий широту возможностей конструирования узоров из кругов. Его создание показалось нам достаточно интересным для того, чтобы описать его в этом уроке.
Далее... Нет комментариев »
Создание встроенной в веб-страницу Google карты

Карты очень полезны для отображения расположения предприятий и мероприятий на веб-страницах. В этом уроке мы рассмотрим только сервис Google карты, но есть и другие сервисы, например, такие как Яндекс карты. Для начала найдите место на Google карте и настройте подходящую степень приближения.
Далее... Нет комментариев »
Создание эффекта набора текста

Во многих фильмах используется набор текста на экране, например, для представления нового места действия. И в этом уроке мы воссоздадим этот эффект, используя веб-технологии. Существует много вариантов создания подобного разными способами, в нашем случае для этого используется JavaScript.
Далее... 1 Комментарий »
Использование возможностей встраивания видео с сайта YouTube

Сервис YouTube предоставляет код для встраивания видео, хранящихся у них, на веб-страницу. Обычно это хорошая идея размещать видео на сайте YouTube: этот сервис поддерживает высококачественные видео в кодировке H.264, дает возможность предоставлять Ваше видео широкой аудитории, для воспроизведения могут использоваться и Flash, и HTML5 технологии, а также с Вашего сервера снимается нагрузка от размещения и хранения видео.
Далее... 1 Комментарий »
Знакомство с предназначением кода CSS

Код HTML используется для создания разметки веб-страницы, все содержимое которой находится в различных элементах, таких как абзац, заголовок и другие. А для задания внешнего вида используется код CSS.
Далее... 1 Комментарий »