Узнайте CSS Flexbox на Lynda.com

• May 9, 2024

Спустя десять лет, что является продолжительностью жизни в Интернете, мы решили придать веб-сайту MUSED Literary Review новый вид. Конечно, мы хотели использовать новейшие HTML и CSS, а это означает использование Flexbox, CSS Grid и адаптивного веб-дизайна.

Благодаря Lynda.com, это не заняло много времени, чтобы набрать скорость. Ниже приведены лишь некоторые из лучших видеоуроков, которые помогли мне создать новый дизайн для MUSED.

Расширенные адаптивные макеты с CSS Flexbox
Мортен Ранд-Хендриксен
В этом основанном на проекте курсе автор шаг за шагом проведет вас по пути создания меню Flexbox, адаптивных макетов карт, макета Святого Грааля и интерактивных компонентов.

Расширенные макеты CSS с сеткой
Мортен Ранд-Хендриксен
Вы многому научитесь в этом курсе. Автор начинает с основ CSS Grid и планирования макетов сетки. Тогда вы готовы построить макет из нескольких столбцов и макет из одного столбца. Далее вы узнаете, как проектировать различные макеты карточек и внеэкранную панель навигации, которая открывается при необходимости.

CSS Essential Training 3
Кристина Труонг
В этом курсе вы научитесь использовать CSS Grid и Flexbox для создания адаптивных макетов. Вы также узнаете, как подготовить веб-изображения для дисплеев Retina и векторных изображений SVG. Затем автор переходит к простой CSS-анимации, адаптивной типографии и доступности.

CSS Flexbox First Look
Джеймс Уильямсон
Этот курс шаг за шагом ознакомит вас с синтаксисом модуля макета CSS Flexbox. Автор обсуждает, что может сделать Flexbox, и текущую поддержку браузера. Затем он подробно обсуждает такие темы, как поток элементов, упаковка содержимого, выравнивание элементов и вложение гибких контейнеров.

CSS Grid First Look
Мортен Ранд-Хендриксен
В этом курсе вы узнаете новый и улучшенный способ создания двухмерных сеток. Начав с основ использования CSS Grid для создания адаптивных макетов сетки, автор раскрывает то, что вам нужно знать, чтобы создать как онлайн-журнал, так и макет из трех столбцов.

Создание адаптивных форм с помощью Flexbox
Джеймс Уильямсон
Вы не можете создать сайт без форм. Формы должны быть такими же отзывчивыми для всех типов и размеров экранов, как и весь сайт. Уильямсон научит вас, как использовать блочную модель CSS Flexbox для создания и стилизации адаптивных веб-форм. Он начинает с простой формы поиска и создает большую форму с двумя столбцами.

Адаптивные изображения
Мортен Ранд-Хендриксен
Если вы используете Wordpress, вы знаете, что он будет автоматически генерировать несколько изображений разных размеров для каждого изображения, которое вы загружаете в систему. Почему? Этот курс расскажет о концепции адаптивных изображений и о том, как использовать их на своем веб-сайте.

Видео инструкция: ActionScript tutorial 24 - Data types in ActionScript Language (May 2024).