1

Етап 1

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

2

Етап 2

Формы и HTML5

3

Етап 3

Селекторы, часть 2

4

Етап 4

Селекторы, часть 3

5

Етап 5

Рамки и фоны, часть 2

6

Етап 6

Игра теней

7

Етап 7

Линейные градиенты

8

Етап 8

Двумерные трансформации

9

Етап 9

Оформление текста, часть 2

10

Етап 10

Анимация

11

Етап 11

Плавные переходы

12

Етап 12

Мастерская: декоративные эффекты на CSS3

13

Етап 13

Таблицы на CSS

14

Етап 14

Кекстаграм: Начало. CSS-фильтры

15

Етап 15

Кекстаграм: Эпилог. JavaScript

16

Етап 16

Флексбокс, часть 1

17

Етап 17

Флексбокс, часть 2

18

Етап 18

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

19

Етап 19

Примеси в LESS

20

Етап 20

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

1

Етап 1

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

2

Етап 2

Формы и HTML5

3

Етап 3

Селекторы, часть 2

4

Етап 4

Селекторы, часть 3

5

Етап 5

Рамки и фоны, часть 2

6

Етап 6

Игра теней

7

Етап 7

Линейные градиенты

8

Етап 8

Двумерные трансформации

9

Етап 9

Оформление текста, часть 2

10

Етап 10

Анимация

11

Етап 11

Плавные переходы

12

Етап 12

Мастерская: декоративные эффекты на CSS3

13

Етап 13

Таблицы на CSS

14

Етап 14

Кекстаграм: Начало. CSS-фильтры

15

Етап 15

Кекстаграм: Эпилог. JavaScript

16

Етап 16

Флексбокс, часть 1

17

Етап 17

Флексбокс, часть 2

18

Етап 18

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

19

Етап 19

Примеси в LESS

20

Етап 20

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

28 грудня 2016

Мета закинута

Автор не відписував в цілі 7 років 10 месяців 8 днів

Загальна

Пройти все платные курсы по подписке

Пройти все платные курсы по подписке

 Критерій завершення

Пройти все платные курсы по подписке

 Особисті ресурси

300р/месяц

 Екологічність мети

Пройти все платные курсы по подписке

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

    Познакомимся с новыми возможностями HTML5. Узнаем какие новые элементы появились в стандарте и как их правильно использовать. Потренируемся вставлять на страницу аудио и видео, подключать и использовать нестандартные шрифты и векторные изображения.

    1. Хедер и футер. Теги header и footer

    2. Основное содержание. Тег main

    3. Разделы страницы. Теги article и section

    4. Изображения в формате SVG

    5. Навигация. Тег nav

    6. Завершаем футер

    7. Использование нестандартных шрифтов

    8. Подробнее о шрифтах. Правило @font-face

    9. Дополнительное содержание. Тег aside

    10. Еще раз про article. Анонс поста

    11. Завершаем главную: наполнение

    12. Внутренняя страница: структура поста

    13. Даты для людей и машин. Тег time

    14. Картинки с подписями. Теги figure и figcaption

    15. Видео. Тег video

    16. Форматы и источники видео

    17. Аудио. Тег audio

    18. Форматы и источники звука

    19. Испытание: другой вариант главной

  2. Формы и HTML5

    Научимся создавать продвинутые формы, используя новые возможности HTML5. Познакомимся с новыми типами полей для ввода дат, цветов, чисел и адресов сайтов. Также рассмотрим такие возможности как автофокус, подсказки, средства валидации и многие другие.

    1. Испытание: формы — вспомнить всё

    2. Сброс введенных значений

    3. Простая кнопка

    4. Кнопка-изображение

    5. Альтернативный способ задания кнопок

    6. Обязательные поля

    7. Поле выбора даты

    8. Поле выбора времени

    9. Список возможных значений

    10. Поле ввода числового значения

    11. Поле поиска

    12. Автофокус

    13. Другие поля для ввода дат

    14. Выбор из диапазона

    15. Область для вывода результата

    16. Группировка полей формы

    17. Паттерны значений полей

    18. Поле ввода телефона

    19. Подсказка при заполнении полей

    20. Поля ввода адресов сайтов и email

    21. Поле выбора цвета

    22. Группировка элементов списка

    23. Запрет редактирования полей

    24. Управление автозаполнением полей

    25. Переключение между полями

    26. localStorage

    27. Проверяем работу localStorage

    28. Испытание: через тернии к звёздам

  3. Селекторы, часть 2

    Рассмотрим продвинутые селекторы, такие как :nth-last-of-type или :only-child. Также научимся использовать псевдоэлементы, такие как ::before и ::after.

    1. Объединение селекторов

    2. Псевдокласс :not

    3. Комбинируем :not

    4. Псевдокласс :nth-last-child

    5. Псевдокласс :first-of-type

    6. Псевдокласс :last-of-type

    7. Псевдокласс :nth-of-type

    8. Псевдокласс :nth-last-of-type

    9. Испытание: первая раскладка

    10. Cелектор последующих элементов

    11. Псевдокласс :empty

    12. Псевдокласс :only-child

    13. Псевдокласс :only-of-type

    14. Псевдоэлемент ::before

    15. Псевдоэлемент ::after

    16. Позиционирование псевдоэлементов

    17. Фон для псевдоэлементов

    18. Псевдоэлементы ::first-line и ::first-letter

    19. Испытание: псевдоэлементы

    20. Испытание: вторая раскладка

  4. Селекторы, часть 3

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

    1. Ищем в начале строки: [foo^="bar"]

    2. Ищем в конце строки: [foo$="bar"]

    3. Поиск подстроки везде: [foo*="bar"]

    4. Поиск слов внутри строки: [foo~="bar"]

    5. Поиск префиксов: [foo|="bar"]

    6. Поиски котов. Часть 1

    7. Поиски котов. Часть 2

    8. Котография 9 на 12

    9. Псевдоклассы :enabled и :disabled

    10. Псевдоклассы :read-only и :read-write

    11. Псевдокласс :required

    12. Псевдокласс :optional

    13. Псевдокласс :checked

    14. Псевдоклассы :invalid и :valid

    15. Псевдоклассы :in-range и :out-of-range

    16. Объединяй и властвуй

    17. Чудеса с ~ и :checked

    18. Испытание: UI-кит для формы

  5. Рамки и фоны, часть 2

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

    1. Подготовка

    2. Размер фона, шаг 1

    3. Размер фона, шаг 2

    4. Границы фона

    5. Обрезка фона

    6. Множественный фон

    7. Позиция фона от разных сторон

    8. Повторение фона: background-repeat: round

    9. Повторение фона: background-repeat: space

    10. Внешняя рамка

    11. Скругление углов, часть 1

    12. Скругление углов, часть 2

    13. Изображение рамки: border-image-source

    14. Изображение рамки: border-image-slice

    15. Нарезка несимметричных картинок

    16. Изображение рамки: border-image-repeat, часть 1

    17. Изображение рамки: border-image-repeat, часть 2

    18. Изображение рамки: border-image-width

    19. Изображение рамки: border-image-outset

    20. Королевская рамка Кексика

    21. Эко-рамка Кексика

    22. Круглая рамка Кексика, часть 1

    23. Круглая рамка Кексика, часть 2

    24. Испытание: морской волк

    25. Рамки и треугольники, часть 1

    26. Рамки и треугольники, часть 2

    27. Рамки и треугольники, часть 3

    28. Стрелка с помощью рамки

    29. Круглая стрелка с помощью рамки, часть 1

    30. Круглая стрелка с помощью рамки, часть 2

    31. Треугольники в жизни, часть 1

    32. Треугольники в жизни, часть 2

    33. Испытание: ювелирная работа

  6. Игра теней

    Взглянем на процесс создания теней с помощью CSS. Мы по косточкам разберём свойство box-shadow, научимся использовать множественные тени, а также изучим некоторые продвинутые приёмы работы с тенями.

    1. Свойство box-shadow

    2. Смещение тени по горизонтали

    3. Смещение тени по вертикали

    4. Размытие тени

    5. Растяжение тени

    6. Размытие + растяжение

    7. Цвет тени

    8. Внутренняя тень

    9. Испытание: тусклые тени

    10. Полупрозрачная тень

    11. Тень только с одной стороны

    12. Множественные тени

    13. Несколько рамок у одного элемента

    14. Теневое искусство – 1

    15. Теневое искусство – 2

    16. Теневое искусство – 3

    17. Испытание: зловещие тени

  7. Линейные градиенты

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

    1. Hello, linear-gradient!

    2. Направление градиента

    3. Градиенты по диагоналям

    4. Градиенты под углом

    5. Диагонали против градусов

    6. Испытание: иконки iOS

    7. Nyan cat наносит ответный удар

    8. Пропорции цветов и колорстопы

    9. Резкие переходы цветов

    10. Псевдоколонки на градиентах

    11. Испытание: флаги

    12. Цветовые переходы в px

    13. Полупрозрачные градиенты

    14. Повторяющийся линейный градиент

    15. Строим сложный фон — часть 1

    16. Строим сложный фон — часть 2

    17. Строим сложный фон — часть 3

    18. Строим сложный фон — финал

    19. Кнопки — часть 1

    20. Кнопки — часть 2

    21. Кнопки — часть 3

    22. Испытание: орнамент из сюрикенов

    23. Испытание: cпутники

  8. Двумерные трансформации

    Будем крутить, наклонять, перемещать, уменьшать и увеличивать объекты, а также взрывать их фаерболами, телепортироваться и использовать телекинез. Ну и, конечно, разберём крутые приёмы использования трансформаций для создания декоративных эффектов.

    1. Перемещение по горизонтали

    2. Перемещение по вертикали

    3. Тренировка фаерболов

    4. Увеличение, уменьшение

    5. Защита города

    6. Начало путешествия

    7. Лабиринт

    8. Битва — часть 1

    9. Битва — часть 2

    10. Испытание: таинственная карта

    11. Битва — часть 3

    12. Испытание: расколотый кристалл

    13. Финальная битва

    14. Особенности transform-origin — часть 1

    15. Особенности transform-origin — часть 2

    16. Особенности transform-origin — часть 3

    17. Особенности transform-origin — часть 4

    18. Центровка с помощью transform: translate

    19. Поворот текста в блоках

    20. Поворот текста в фоне

    21. Нестандартные тени

    22. Эффекты при наведении: кнопки — часть 1

    23. Эффекты при наведении: кнопки — часть 2

    24. Эффекты при наведении: кнопки — часть 3

    25. Эффекты при наведении: галерея

    26. «Стопка» карт

    27. Круговое меню, подготовка

    28. Круговое меню, шаг 1

    29. Круговое меню, шаг 2

    30. Круговое меню, шаг 3

    31. Круговое меню, финал

    32. Испытание: раскладка карт

  9. Оформление текста, часть 2

    Мы в прямом смысле «наиграемся со шрифтами», декоративными текстовыми эффектами и тенями, а ещё узнаем, как повысить читабельность текстов с помощью новых CSS-свойств.

    1. Unicode-символы

    2. Свойство text-shadow

    3. Смещение текстовой тени по горизонтали

    4. Смещение текстовой тени по вертикали

    5. Размытие текстовой тени

    6. Цвет текстовой тени

    7. Эффект вдавленного текста

    8. Декоративная ретро-тень

    9. Испытание: психоделическая тень

    10. Логотип: нестандартный шрифт

    11. Логотип: иконочный шрифт

    12. Логотип: выравнивание размеров

    13. Декоративная стилизация строки, шаг 1

    14. Декоративная стилизация строки, шаг 2

    15. Свойство text-indent

    16. Псевдоэлемент ::first-letter

    17. Псевдоэлемент ::first-line

    18. Колоночная разметка: свойство column-count

    19. Колоночная разметка: свойство column-width

    20. Колоночная разметка: свойство column-gap

    21. Направление текста

    22. Направление текста и таблицы

    23. Переполнение текста

    24. Интервал между словами

    25. Испытание: why so serious?

    26. Испытание: поиграйся со шрифтами

  10. Анимация

    Рассмотрим основы анимации на CSS. Нам предстоит пройти путь развития цивилизации и покорить космический простор. Мы будем двигать, поворачивать и видоизменять объекты, попутно осваивая приёмы работы анимации в CSS.

    1. Привет, animation!

    2. @keyframes: раскадровка

    3. @keyframes: from и to

    4. @keyframes: группировка кадров

    5. Множественная анимация, шаг 1

    6. Множественная анимация, шаг 2

    7. Водное путешествие

    8. Количество проигрываний анимации: animation-iteration-count

    9. Направление анимации: animation-direction, шаг 1

    10. Направление анимации: animation-direction, шаг 2

    11. Задержка начала анимации: animation-delay, шаг 1

    12. Задержка начала анимации: animation-delay, шаг 2

    13. Задержка начала анимации: animation-delay, шаг 3

    14. Воздушное путешествие

    15. Состояние до и после анимации: animation-fill-mode, шаг 1

    16. Состояние до и после анимации: animation-fill-mode, шаг 2

    17. Состояние до и после анимации: animation-fill-mode, шаг 3

    18. Состояние до и после анимации: animation-fill-mode, шаг 4

    19. Состояние до и после анимации: animation-fill-mode, шаг 5

    20. Запуск фабрики, шаг 1

    21. Запуск фабрики, шаг 2

    22. Остановка и запуск анимации: animation-play-state

    23. «Форма» анимации, animation-timing-function

    24. animation-timing-function, шаг 2

    25. animation-timing-function, шаг 3

    26. animation-timing-function, шаг 4

    27. Ракета на старт, шаг 1

    28. Ракета на старт, шаг 2

    29. Посадка, шаг 1

    30. Посадка, шаг 2

    31. Посадка, шаг 3

  11. Плавные переходы

    Научимся плавно менять CSS-свойства, будем создавать красивые и функциональные элементы форм в стиле Material Design и построим мини-викторину об HTML и CSS.

    1. Длительность перехода, transition-duration

    2. Длительность перехода, шаг 2

    3. transition-property: какие свойства изменять плавно?

    4. Задержка перехода, transition-delay

    5. «Форма» перехода, transition-timing-function

    6. transition-timing-function, шаг 2

    7. transition-timing-function, шаг 3

    8. transition-timing-function, шаг 4

    9. Бумажные кнопки, шаг 1

    10. Бумажные кнопки, шаг 2

    11. Бумажные кнопки, шаг 3

    12. Чекбоксы, шаг 1

    13. Чекбоксы, шаг 2

    14. Чекбоксы, шаг 3

    15. Радио-кнопки, шаг 1

    16. Радио-кнопки, шаг 2

    17. Радио-кнопки, шаг 3

    18. Переключатели, шаг 1

    19. Переключатели, шаг 2

    20. Переключатели, шаг 3

    21. Переключатели, шаг 4

    22. Иконка-трансформер, шаг 1

    23. Иконка-трансформер, шаг 2

    24. Иконка-трансформер, шаг 3

    25. Иконка-трансформер, шаг 4

    26. Текстовое поле ввода, шаг 1

    27. Текстовое поле ввода, шаг 2

    28. Текстовое поле ввода, шаг 3

    29. Текстовое поле ввода, шаг 4

  12. Мастерская: декоративные эффекты на CSS3

    Это прикладной курс, в котором вы будете создавать сложные элементы интерфейса и крутые эффекты, используя новые возможности HTML5 и CSS3. Вы построите сложные навигационные элементы, поэкспериментируете с масками, эффектами при наведении и даже создадите слайдер на чистом CSS.

    1. Маска при наведении, шаг 1

    2. Маска при наведении, шаг 2

    3. Маска при наведении, шаг 3

    4. Маска при наведении, шаг 4

    5. Выдвигающееся описание, шаг 1

    6. Выдвигающееся описание, шаг 2

    7. Выдвигающееся описание, шаг 3

    8. Эффектные ссылки, шаг 1

    9. Эффектные ссылки, шаг 2

    10. Эффектные ссылки, шаг 3

    11. Эффектные ссылки, шаг 4

    12. Эффектные ссылки, шаг 5

    13. Эффектные ссылки, шаг 6

    14. Эффектные ссылки: все вместе

    15. Закруглённые внутрь углы, шаг 1

    16. Закруглённые внутрь углы, шаг 2

    17. Закруглённые внутрь углы, шаг 3

    18. Закруглённые внутрь углы, шаг 4

    19. Испытание: статистика браузеров

    20. Слайдер на CSS, шаг 1

    21. Слайдер на CSS, шаг 2

    22. Слайдер на CSS, шаг 3

    23. Слайдер на CSS, шаг 4

    24. Хлебные крошки, шаг 1

    25. Хлебные крошки, шаг 2

    26. Хлебные крошки, шаг 3

    27. Хлебные крошки, шаг 4

    28. Хлебные крошки, шаг 5

    29. Маркер на карте, шаг 1

    30. Маркер на карте, шаг 2

    31. Испытание: щит Завтрамэна

  13. Таблицы на CSS

    Взглянем на таблицы с другой стороны: научимся строить их с помощью CSS, исследуем и опробуем на практике редкие табличные свойства. А также нас ждёт интересное и непростое путешествие за Святым Граалем.

    1. CSS-таблица

    2. Ряды и ячейки таблицы

    3. Заголовок таблицы

    4. Группировка верхних рядов и ячеек

    5. Группировка нижних рядов и ячеек

    6. Группировка основных рядов и ячеек, часть 1

    7. Группировка основных рядов и ячеек, часть 2

    8. Колонка таблицы

    9. Группировка колонок таблицы

    10. Испытание: строим таблицу на CSS

    11. Строчная таблица

    12. Горизонтальное выравнивание таблицы

    13. Горизонтальное и вертикальное выравнивание

    14. Ячейки и границы таблицы

    15. Holy Grail, часть 1

    16. Holy Grail, часть 2

    17. Holy Grail, часть 3

    18. Испытание: ещё одна CSS-таблица

  14. Кекстаграм: Начало. CSS-фильтры

    Вместе станем мастерами фильтров в CSS: разберёмся, как применять фильтры к разным элементам, а также комбинировать и анимировать их.

    1. Яркость и контрастность, brightness и contrast

    2. Бесцветность и сепия, grayscale и sepia

    3. Инверсия и насыщенность, invert и saturate

    4. Поворот цвета, hue-rotate

    5. Размытость и непрозрачность, blur и opacity

    6. Тень, drop-shadow

    7. Отличие box-shadow и drop-shadow

    8. Применение CSS-фильтров к тексту

    9. Испытание: разные фильтры

    10. Комбинация фильтров

    11. Комбинация фильтров drop-shadow

    12. Анимация CSS-фильтров

    13. Плавные переходы и CSS-фильтры

    14. Испытание: комбинации фильтров

  15. Кекстаграм: Эпилог. JavaScript

    В сиквеле курса «Кекстаграм» нам предстоит запрограммировать небольшое фотоприложение с фильтрами на JavaScript.

    1. Кекстаграм: разметка

    2. Кекстаграм: первый фильтр

    3. Кекстаграм: репетируем переключение

    4. Кекстаграм: второй фильтр

    5. Кекстаграм: наконец-то JavaScript

    6. Кекстаграм: играем с классами

    7. Кекстаграм: расшифровка кода

    8. Кекстаграм: третий фильтр

    9. Испытание: испорченные портреты

    10. Кекстаграм: строки и переменные

    11. Кекстаграм: используем функцию

    12. Кекстаграм: экспериментируем с вызовом функции

    13. Кекстаграм: добавляем data-атрибуты

    14. Кекстаграм: используем data-атрибуты

    15. Кекстаграм: знакомимся с циклом

    16. Кекстаграм: используем цикл

    17. Кекстаграм: завершаем функцию переключения

    18. Кекстаграм: программируем переключатели, часть 1

    19. Кекстаграм: программируем переключатели, часть 2

    20. Кекстаграм: завершаем переключатели

    21. Кекстаграм: сравнение фото

    22. Кекстаграм: ползунок-разделитель

    23. Кекстаграм: двигаем ползунок

    24. Кекстаграм: четвёртый фильтр

    25. Кекстаграм: четвёртый фильтр, завершение

    26. Кекстаграм: финал

    27. Испытание: игровые фишки

  16. Флексбокс, часть 1

    Рассмотрим основы нового механизма «гибкой» раскладки — флексбокс. Сначала потренируемся «на котиках» направлять оси флекс-контейнера, выравнивать и переносить флекс-элементы, а затем научимся простому применению флексбокса в реальных интерфейсах.

    1. Флексбокс, display: flex

    2. Главная ось, flex-direction

    3. Поперечная ось

    4. Распределение флекс-элементов, justify-content

    5. В начале и в конце главной оси

    6. Равномерное распределение

    7. Выравнивание флекс-элементов, align-items

    8. В начале и в конце поперечной оси

    9. Выравнивание элементов по базовой линии

    10. Эгоистичное выравнивание, align-self

    11. Выравнивание одного элемента по базовой линии

    12. Испытание: простая палитра

    13. Перенос флекс-элементов, flex-wrap

    14. Перенос в обратном порядке

    15. Выравнивание строк флекс-контейнера, align-content

    16. align-content: stretch и align-items

    17. align-content: не-stretch и align-items

    18. Остальные значения align-content

    19. Порядковый номер флекс-элемента, order

    20. Испытание: палитра посложнее

    21. Идеальное центрирование, margin: auto

    22. Идеальное центрирование, флекс-выравнивания

    23. «Гибкое» меню

    24. «Гибкое» меню, часть 2

    25. «Гибкое» меню, часть 3

    26. Вертикальный ряд иконок

    27. Вертикальный ряд иконок, часть 2

    28. Вертикальный ряд иконок, часть 3

    29. Сортировка элементов на CSS

    30. Блоки одинаковой высоты

    31. Испытание: сложные палитры

  17. Флексбокс, часть 2

    Узнаем как управлять размерами и отступами флекс-элементов и как работают коэффициенты растяжения и сжатия, а также потренируемся создавать «гибкие» раскладки и элементы интерфейса.

    1. Флекс-элементы и блочная модель

    2. Особенности свойства margin

    3. Выравнивание и внешние отступы

    4. Направление главной оси и внешние отступы

    5. Базовый размер флекс-элемента, flex-basis

    6. Испытание: кубизм

    7. Коэффициент растягивания элементов, flex-grow

    8. Пропорциональное растягивание элементов

    9. Расчёт итогового размера с flex-grow

    10. Коэффициент сжатия элементов, flex-shrink

    11. Пропорциональное сжатие элементов

    12. Расчёт итогового размера с flex-shrink

    13. flex-shrink и min-width

    14. Испытание: мастер коэффициентов

    15. Сокращённое свойство flex

    16. Многострочный флекс-контейнер и flex-shrink

    17. Многострочный флекс-контейнер и flex-grow

    18. flex-basis: 100% и flex-wrap

    19. Заголовок с описанием на флексбоксах

    20. Заголовок с описанием, часть 2

    21. «Гибкое» меню с переполнением

    22. «Гибкое» меню с переполнением, часть 2

    23. Поля ввода с динамической шириной

    24. Карточка курса

    25. Карточка курса, часть 2

    26. Карточка курса, часть 3

    27. Много карточек

    28. Испытание: гибкий поток

  18. Знакомство с LESS

    Познакомимся с основами препроцессора LESS и начнём разрабатывать свою библиотеку визуальных компонентов. Вместе научимся создавать цветовую схему для элементов интерфейса.

    1. Введение

    2. Переменные, шаг 1

    3. Переменные, шаг 2

    4. Цветовые функции, введение

    5. Вложенные правила, шаг 1

    6. Вложенные правила, шаг 2

    7. Математические операции, шаг 1

    8. Математические операции, шаг 2

    9. Математические операции, шаг 3

    10. Цветовые функции, шаг 2

    11. Цветовые функции, шаг 3

    12. Цветовые функции, шаг 4

    13. Цветовые функции, шаг 5

    14. Испытание: палитра

  19. Примеси в LESS

    Продолжим изучать возможности препроцессора LESS: познакомимся с примесями, научимся применять примеси с условиями, разберёмся, как создавать и использовать циклы. Также мы рассмотрим примеры использования примесей для решения типовых задач вёрстки.

    1. Вспоминаем переменные

    2. Примеси

    3. Несколько примесей

    4. Примесь с параметром

    5. Примесь с параметром, часть 2

    6. Значение параметра примеси по умолчанию

    7. Примесь с несколькими параметрами

    8. Испытание: части головоломки

    9. Шаблоны примесей

    10. Шаблоны примесей, часть 2

    11. Шаблоны примесей, часть 3

    12. Испытание: примеси и портреты

    13. Примесь с условием

    14. Примесь с условием, часть 2

    15. Условия и внешние переменные

    16. Условия и типы параметров

    17. Испытание: примеси и портреты, часть 2

    18. Переменные-вставки

    19. Цикл

    20. Цикл, часть 2

    21. Испытание: разноцветные ступеньки

    22. Вертикальный ритм текста

    23. Вертикальный ритм текста, часть 2

    24. Цвета блоков-оповещений

    25. Цвета блоков-оповещений, часть 2

    26. Примесь для центровки блока

    27. Примесь для треугольных форм

    28. Примесь для треугольных форм, часть 2

    29. Примесь для треугольных форм, часть 3

    30. Испытание: круглая стрелка с помощью рамки

  20. Знакомство с SVG

    Мы познакомимся с SVG — форматом векторной графики. Разберём базовые примитивы: линии, прямоугольники, окружности. Научимся позиционировать их, управлять цветом и размерами, собирать из них разные рисунки.

    1. Привет, SVG!

    2. Рисуем прямоугольник

    3. Координаты прямоугольника

    4. Скругление углов

    5. Испытание: починка телевизора

    6. Многоугольники

    7. Испытание: пирамиды

    8. Рисуем окружность

    9. Испытание: мишень

    10. Рисуем эллипс

    11. Испытание: удивлённый смайлик

    12. Рисуем линии

    13. Испытание: арифметические знаки

    14. Рисуем ломаные линии

    15. Испытание: воздушные шары

  • 1605
  • 28 грудня 2016, 17:52

Реєстрація

Можливості
безмежні.
Настав час
відкрити свої.

Уже зарегистрированы?
Швидка реєстрація через соцмережі
Вхід на сайт

Заходьте.
Відкрито.

not_registered
 
Підключіться до будь-якого з ваших акаунтів, ваші дані будуть взяті з акаунту.
Забули пароль?