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

• 

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

  В этом уроке мы создадим более сложный логотип Volkswagen. Логотипы, о создании которых мы рассказывали раньше, состояли из плоских фигур, тогда как у логотипа Volkswagen гораздо больше глубины, несколько градиентов и тени. Мы сосредоточимся на свойстве градиента CSS3, разбирая код и объясняя синтаксис. Также коснемся свойства box-shadow и повторим вкратце псевдоэлементы.

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

  Создание логотипа Темного Рыцаря с использованием CSS3

  Продолжая тему предыдущего урока, в котором мы воссоздали логотип Бэтмена с использованием CSS3, мы решили рассказать о создании логотипа Бэтмена, используемого в новых фильмах. Этот логотип проще, и его легче создать, чем исходный логотип Бэтмена, так что мы добавили несколько дополнений, таких как градиенты CSS3 и тень блока, чтобы не стоять на месте и коснуться темы, не [...]

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

  Создание логотипа Бэтмена с использованием CSS3

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

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

  Применение режима наложения CSS3

  Если вы когда-либо использовали графический редактор, такой как Photoshop или Pixelmator, вы, вероятно, уже знакомы с режимами наложения. Режимы наложения — это ряд режимов, которые позволяют объекту смешаться с другими объектами, и создают таким образом результирующее изображение. При правильном использовании режим наложения позволит получить впечатляющий результат, например, такой:

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

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

  Недавно мы показывали, как создать логотип ленты новостей RSS с использованием CSS3. Нам показалось интересным создать что-то более сложное. В этом уроке мы покажем, как создать даже не один, а два варианта логотипа Gmail, используя только CSS3.

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

  Создание изображений, поддерживающих экраны Retina, с использованием media query

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

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

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

  В этом уроке мы постараемся воссоздать логотип компании Pepsi без помощи изображений, используя только CSS. Конечно, этот логотип возможно создать и другими способами, так что не стесняйтесь экспериментировать. Логотип не особо сложный, в нем нет теней, световых эффектов или других деталей, требующих особого внимания. Только простые однотонные цвета — отлично для начала. Вот как это выглядит.

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

  Создание логотипа ленты новостей RSS с использованием CSS3

  Благодаря своей функции логотип ленты новостей RSS — один из наиболее часто используемых логотипов в веб-дизайне. Вы, скорее всего, встречали много уроков по созданию логотипа ленты новостей RSS с помощью графических редакторов, таких как Photoshop, а как насчет нарисовать этот логотип, использую только CSS3?

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

  Знакомство с единицами измерения CSS: пикселями, EM и процентами

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

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