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

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

Создание стилей для полос прокрутки

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

Переходы и анимации могут использоваться не только для украшения. Они также могут подсказывать, что происходит на веб-странице. Если элемент пункта списка вставляется в элемент списка, то вместо того, чтобы он просто внезапно появился, можно использовать анимацию, сдвигающую список для освобождения места для нового пункта списка, которая сделает происходящее предельно понятным. Без нее очень легко пропустить [...]
Далее... Нет комментариев »
Создание исчезающего с задержкой атрибута заглушки

Нам показалось полезным изменение поведение атрибута заглушки у браузеров Chrome и Safari, при котором текст не исчезал, пока пользователь не начинал печатать, а не при получении элементом фокуса. Конечно, атрибут заглушки не может заменить настоящее объяснение, для чего именно используется этот элемент ввода текста. Но если с помощью атрибута заглушки можно лучше понять, как заполнять это поля [...]
Далее... Нет комментариев »
Интересное оформление для элемента цитаты с использованием CSS

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

Поле ввода текста — это элемент веб-страницы, в который можно вводить информацию. Эти элементы обычно используются для комментариев, форм обратной связи или полей для адреса. У всех браузеров по умолчанию применяются разные стили для полей ввода текста. Этим элементам можно задавать стили с помощью CSS так же, как и любому другому элементу:
Далее... Нет комментариев »
Собственные названия для упрощения записи свойств для сеток CSS

Можно представить собственные названия у сеток CSS как собственный синтаксис. Без них можно обойтись, выразив расположение сеток другими способами, но они могут помочь сделать расположение более интуитивно понятным.
Далее... Нет комментариев »
Создание скругленной изнутри рамки

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

В таких браузерах для настольных компьютеров, как Safari, Chrome, Firefox и Opera с движком Presto, но не в браузере Internet Explorer и не в браузерах для мобильных устройств, у поля ввода текста есть небольшой элемент для изменения размера, расположенный в правом нижнем углу. Поля ввода текста созданы для ввода текста в них, так что если пользователям нужно больше [...]
Далее... Нет комментариев »
Неверный псевдоселектор может привести к игнорированию всего правила

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