Перейти к содержимому









Фотография
Скачать

[WebForMySelf] Технология CSS Grid



  • Авторизуйтесь для ответа в теме
Сообщений в теме: 5

#1 OXAS

OXAS
  • Сливапер LVL 7
  • Сообщений: 11 530
  • Регистрация: 08.01.2015
  • Заработано: 19 686 руб.
Репутация: 18 970

Награды: 53

  
  
  
  
  
  
  
  

Отправлено 31 Май 2019 - 10:18

Название: Технология CSS Grid

Автор: WebForMySelf


Релиз курса состоится 28 мая 2019 года.
Автор: Денис Булыга

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

CSS Grid – высший пилотаж в верстке
CSS Grid — это мощная новая технология в верстке. Она позволяет быстро создавать динамические, отзывчивые, современные макеты на чистом CSS. При этом код чище и проще в поддержке, по сравнению с традиционными методами верстки.

Grid Layout — это новая модель макета, которая обладает мощными способностями контролировать размеры и расположение блоков, а также их содержимого.

Она представляет собой набор горизонтальных и вертикальных линий, которые образуют сетку, состоящую из рядов и колонок. Технология основана на разделении пространства для макета на столбцы и строки, а также на использовании предсказуемого поведения размеров.

Grid позволяет точно позиционировать и масштабировать блоки контента в областях сетки, получаемых при пересечении этих столбцов и строк. Таким образом, получаем очень гибкое поведение верстки при адаптации.

 

Содержание курса:
Блок 1. Верстка макета Landing Page
Урок 1. Обзор PSD-макета и готовой верстки Landing Page
Урок 2. Экспорт изображений для верстки из Adobe Photoshop CC 2018
Урок 3. Установка Node Js, Gulp CLI и инициализация проекта
Урок 4. Начало создания автоматизированной сборки при помощи Gulp 4
Урок 5. Создание дополнительных задач по автоматизации
Урок 6. Подготовка к верстке и детальный обзор проекта
Урок 7. Создание HTML-разметки для шапки сайта
Урок 8. Полная стилизация шапки сайта
Урок 9. Создание разметки для блока баннера
Урок 10. Стилизация баннера и написание собственного миксина
Урок 11. HTML-структура блока с преимуществами
Урок 12. Полная стилизация преимуществ
Урок 13. HTML-разметка блока с работами
Урок 14. Написание стилей для блока работ
Урок 15. Доступность интерактивных элементов и адаптация блока работ
Урок 16. Написание структуры для информационного блока
Урок 17. Полная стилизация информационного блока
Урок 18. Создание разметки для блока скиллов
Урок 19. Стилизация блока со скиллами
Урок 20. Анимация линий блока прогресса
Урок 21. HTML-структура блока новостей
Урок 22. Полная стилизация блока с новостями
Урок 23. HTML-разметка блока карусели
Урок 24. Стилизация карусели и подключение плагина OwlCarousel
Урок 25. HTML-разметка блока контактов
Урок 26. Полная стилизация блока контактов
Урок 27. Полная реализация подвала

Блок 2. Верстка главной страницы сайта студии
Урок 1. Обзор макета
Урок 2. Экспорт SVG из Adobe Illustrator
Урок 3. Подготовка к верстке
Урок 4. HTML-разметка шапки сайта
Урок 5. Стилизация шапки сайта
Урок 6. Адаптив шапки сайта
Урок 7. Улучшение типографики
Урок 8. Создание разметки для блока меню
Урок 9. Стилизация блока меню
Урок 10. Доработка меню
Урок 11. HTML-разметка блока проектов
Урок 12. Стилизация блока проектов. Часть 1
Урок 13. Стилизация блока проектов. Часть 2
Урок 14. Стилизация блока проектов. Часть 3
Урок 15. Адаптация блока проектов
Урок 16. HTML-разметка блока студио
Урок 17. Стилизация блока студио. Часть 1
Урок 18. Стилизация блока студио. Часть 2
Урок 19. Адаптация блока студио
Урок 20. HTML-разметка блока с новостями
Урок 21. Стилизация блока новостей
Урок 22. Адаптация блока новостей
Урок 23. Разметка подвала
Урок 24. Полная стилизация подвала сайта
Урок 25. Подключение Google maps

 

Бонусы к основному курсу:
Блок 1. Верстка макета Landing Page
Блок 2. Верстка главной страницы сайта студии
Бонус 1. Учебник по основам HTML для начинающих
Бонус 2. Учебник по основам CSS для начинающих
Бонус 3. Верстка сайта для начинающих
Бонус 4. Курс по HTML5. Основы
Бонус 5. Курс по CSS3
Бонус 6. Теория и практика адаптивной верстки
Бонус 7. CSS Grid Layout
Бонус 8. Flexbox
Бонус 9. Препроцессор Sass
Бонус 10. Построение сеток при помощи Masonry

Скрытый контент:

  Для просмотра необходимо войти или зарегистрироваться


Скачать:

Скрытый контент:

  Для просмотра содержимого необходимо 100 очков репутации (вам не хватает 100)

 Скачать без ограничений   Купить этот материал за 390 руб.


Сообщение отредактировал OXAS: 31 Май 2019 - 10:19


🔔 Подпишись на наш канал telegram @slivup_live и бота @kurs_slivup, что бы следить за крутыми новинками форума

  • 5

#2 vasy345

vasy345
  • Premium
  • Сообщений: 22
  • Регистрация: 28.08.2015
  • Заработано: 0 руб.
Репутация: 1

Награды: 14

  
  
  
  
  
  
  
  

Отправлено 27 Июнь 2019 - 16:36

Обновите, пожалуйста, ссылку.


  • 0

#3 Dcotorbee

Dcotorbee
  • Premium
  • Сообщений: 2
  • Регистрация: 17.08.2014
  • Заработано: 0 руб.
Репутация: 0

Награды: 12

  
  
  
  
  
  
  
  

Отправлено 06 Июль 2019 - 00:09

Ссылка битая, можете решить проблему?

Буду признателен


  • 0

#4 lifepusher

lifepusher
  • Сливапер LVL 7
  • Сообщений: 5 501
  • Регистрация: 19.03.2015
  • Заработано: 7 864 руб.
Репутация: 10 196

Награды: 47

  
  
  
  
  
  
  
  

Отправлено 06 Июль 2019 - 00:22

Dcotorbee,

 

1. Внизу стартового поста есть специальная кнопочка для запроса на восстановление битых ссылок. Так запрашивать правильней и надёжней.

 

2. Курс уже месяц как слит в паблик. Например, есть на безымянном трекере.

Если доступ блокирует провайдер, можно использовать magnet-ссылку:

 

Скрытый контент:

  Для просмотра содержимого необходимо 10 очков репутации (вам не хватает 10)

 Скачать без ограничений   Купить этот материал за 390 руб.


  • 1

#5 SedoyDT

SedoyDT
  • Premium
  • Сообщений: 5
  • Регистрация: 29.06.2019
  • Заработано: 0 руб.
Репутация: 0

Награды: 8

  
  
  
  
  
  
  
  

Отправлено 25 Сентябрь 2019 - 11:20

OXAS, прошу обновить ссылку, а так же делаю запрос на восстановление в специальном разделе.
  • 0

#6 Slivuper_007

Slivuper_007

    Хозяин Сливапа

  • Сливапер LVL 7
  • Сообщений: 3 661
  • Регистрация: 15.03.2014
  • Заработано: 12 715 руб.
Репутация: 15 105

Награды: 58

  
  
  
  
  
  
  
  

Отправлено 25 Сентябрь 2019 - 11:25

SedoyDT,

Скрытый контент:

  Для просмотра содержимого необходимо 300 очков репутации (вам не хватает 300)

 Скачать без ограничений   Купить этот материал за 390 руб.


  • 1



Похожие темы Collapse

  Название темы Форум Автор Статистика Последнее сообщение

Количество пользователей, читающих эту тему: 1

0 пользователей, 1 гостей, 0 анонимных

×

Зарегистрируйся моментально!