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

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

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

  • Постоянная ссылка на Создание анимированного значка скачивания с использованием CSS

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

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

    Далее... 2 Комментариев »
  • Постоянная ссылка на Использование псевдокласса CSS3 :target

    Использование псевдокласса CSS3 :target

    Псевдоклассы CSS, изменяющие стили после определенных действий пользователей, существуют очень давно. Вы точно знакомы с такими псевдоклассами, как :hover, :active и :focus, а некоторые даже могут вспомнить восторг от появления возможности смены цветов ссылок с их помощью в браузере Internet Explorer 4 в далеком 1997 году.

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

    Создание трехмерной нажимаемой кнопки с использованием CSS3

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

    Далее... 2 Комментариев »
  • Постоянная ссылка на Создание вертикального разворачивающегося меню

    Создание вертикального разворачивающегося меню

    С помощью псевдокласса :target можно создать многое, например, переключение между вкладками с использованием только CSS3. Одним из главных преимуществ кода CSS является то, что можно задавать любые стили коду HTML, так что мы преобразуем ту разметку, чтобы она выглядела как вертикальное разворачивающееся меню.

    Далее... 2 Комментариев »
  • Постоянная ссылка на Создание нескольких рамок с использованием CSS3

    Создание нескольких рамок с использованием CSS3

    Свойство рамки CSS2.1 работает хорошо, но оно недостаточно гибкое. А что, если нужно создать две или больше рамок разных цветов у одного элемента? Свойство изображения рамки CSS3 можно рассматривать как вариант, но для него нужно создать подходящее изображение, и синтаксис этого свойства довольно сложный. Но есть другой более простой способ — свойство тени блока, если нужно добавить несколько [...]

    Далее... 1 Комментарий »
  • Постоянная ссылка на Создание выдвигающейся формы поиска

    Создание выдвигающейся формы поиска

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

    Далее... 1 Комментарий »
  • Постоянная ссылка на Как растянуть элементы, находящиеся в блоках, на полную ширину окна браузера

    Как растянуть элементы, находящиеся в блоках, на полную ширину окна браузера

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

    Далее... 1 Комментарий »
  • Постоянная ссылка на Создание эффектов размытого текста с использованием CSS3

    Создание эффектов размытого текста с использованием CSS3

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

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

    Создание светящихся ссылок с использованием CSS3

    В предыдущем уроке по CSS мы создали размытие текста, используя свойство тени текста и прозрачный цвет текста. В этом уроке мы воспользуемся подобным способом, чтобы создать анимированные светящиеся ссылки. Тень текста — это многогранное свойство CSS3, которое поддерживается в браузерах без приставок производителей. Но оно не работает в браузере Internet Explorer версий 9 и ниже. [...]

    Далее... 2 Комментариев »

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