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

• 

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

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

  Далее... 1 Комментарий »
• 

  Использование псевдокласса CSS :nth-child

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

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

  Обзор условных инструкций CSS

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

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

  Цикл уроков об анимациях CSS3. Часть 1. Основы. Что такое анимации?

  Если вы читали наш цикл уроков о переходах CSS3, то знаете, что переходы — это анимированные эффекты между начальным и конечным состояниями, которые запускаются событием, таким как активация псевдокласса CSS :hover или событием Javascript. В этом цикле уроков мы рассмотрим анимации CSS3. У них много общего с переходами, но они более гибкие и несколько более сложные в [...]

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

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

  В этом уроке мы создадим галерею изображений с увеличением изображения при нажатии на него. Еще мы добавим кнопку для закрывания увеличенного изображения. И, что самое главное, мы сделаем это на чистом CSS! Лучше всего, чтобы страница с галереей не прокручивалась, так как псевдокласс :target прокрутит страницу до активного элемента, что будет раздражать, если страница может прокручиваться.

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

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

  В этом уроке мы создадим раздвигающуюся галерею изображений, использую только CSS. И еще мы рассмотрим альтернативу псевдоклассу :target. Посмотрите пример, чтобы увидеть, как работает галерея изображений.

  Далее... 1 Комментарий »
• 

  Цикл уроков о переходах CSS3, часть 4: Продвинутые способы переходов

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

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

  Создание ярлыков с использованием CSS для добавления пометок содержимому

  Ярлыки обычно используются после содержимого веб-страницы, чтобы расположить его по категориям. Создания ярлыка, который выглядит, как настоящая бирка, — это весьма интересная идея, но это может быть довольно сложно. В этом уроке мы создадим легкий в использовании ярлык с минимально возможным синтаксисом, без использования изображений, используя только CSS и HTML.

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

  Создание параллакс-эффекта

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

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