1

Step 1

Знакомство с FlexBox

2

Step 2

Свойства FlexBox

3

Step 3

Свойства FlexBox - 2

4

Step 4

Управляем размерами блоков

5

Step 5

Управление выводом

6

Step 6

Flexbox на практике

1

Step 1

Знакомство с FlexBox

2

Step 2

Свойства FlexBox

3

Step 3

Свойства FlexBox - 2

4

Step 4

Управляем размерами блоков

5

Step 5

Управление выводом

6

Step 6

Flexbox на практике

31 July 2015 30 September 2015
Goal completed 26 September 2015

Goal author

Александр П

Russia, Москва

46 years old

Education

[loftblog] - Flexbox CSS3

Flexbox позволяет контролировать размер, порядок и выравнивание элементов по нескольким осям, распределение свободного места между элементами и многое другое.

 Goal Accomplishment Criteria

Материал изучен

  1. Знакомство с FlexBox

    Сегодня начинаем знакомиться с FlexBox. Мы узнаем, про его терминологию, кроссбраузерность, какие свойства CSS в нем не работают, и маленькие нюансы по обработке внешних отступов (margin).

  2. Свойства FlexBox

    Оси – это главное во FlexBox, потому как именно с их помощью вы сможете “рулить” размещением flex-элементов. И если вы поймете, как ими управлять – пол дела уже сделано! Этим сегодня мы и займемся ;)

  3. Свойства FlexBox - 2

    Если вы попробуете разместить новые flex-элементы на новый ряд – flexbox “скрутит вам большую фигу” и все равно разместит их в одну линию. Даже если вы пропишите своим блокам большую ширину или высоту. В этом уроке вы научитесь задавать ряды, выравнивать их и управлять ими. Налетай!

  4. Управляем размерами блоков

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

  5. Управление выводом

    В пятом видео мы научимся управлять местоположением и выводом flex-элементов. Это занятие очень легкое и очень интересное! Представьте, вы можете менять вывод блоков сайта как вашей душе угодно только в CSS, без правки HTML, PHP или какого-либо другого кода.

  6. Flexbox на практике

    Сегодня попробуем немножко применять flexbox на практике, на примере создания простого сайта. В описании к видео я также скинул вам ссылку на текстовый файл с актуальными префиксами для свойств flex.

  • 1427
  • 31 July 2015, 06:44
Sign up

Signup

Уже зарегистрированы?
Quick sign-up through social networks.
Sign in

Sign in.
Allowed.

Not registered yet?
 
Log in through social networks
Forgot your password?