ТОП-10 фишек HTML/CSS верстки сайта КОТОРЫЕ ТЫ ОБЯЗАН ЗНАТЬ

Мы продолжаем рубрику фишки Html, CSS для верстки сайта для начинающих. В этом видео я расскажу моменты html css, которые обязан знать каждый начинающий верстальщик. В верстке сайтов есть очень много не очевидных и сложных моментов для новичков, которые вводят просто в ступор и иногда у новичка верстки сайтов даже отпадает желание продолжать изучение верстки. Но на самом деле верстка сайта уже не так сложна как это было те же 10 лет назад. Создано много новых свойст и концепций, все делается намного легче. В этом видео я подробно расскажу способ создания легчайшего адаптивного меню на html css и немного javascript. Рассмотрим работу с переменными CSS, и как сделать адаптивность для сайта за 3 секунды.

Nicepage - это сайт-билдер, с которым справится каждый.Размещайте элементы дизайна свободно, как в Figma и Photoshop, при этом получится работающий сайт и чистый HTML код.Nicepage автоматически адаптирует сайт для мобильных устройств.

[SuprunAlexey]

Таймкоды:
1:27 - Адаптивное меню самым быстрым способом
6:19 - Переменные CSS
8:10 - Иконка для сайта в браузере во вкладках
9:22 - Автозаполняемый выпадающий список
10:16 - Плавная прокрутка к якорькам
12:11 - Выбор цвета через инпут
12:50 - Видео для фона сайта
14:21 - CSS Grid, адаптивность для сайта за три секунды

[CathodeUT]

Для человека только начавшего изучать эти языки это просто взрыв мозга, всё так быстро что я даже не успеваю понять какая строка что меняет, а ты уже на следующей))

[DreamingDolphing]

Верстка стала чуть проще в том, что IE наконец подох. В остальном с 2010 писать код стало намного сложнее, потому что объём знаний сильно вырос.

[nodirayakubova]

Класс больше про JavaScript HTML CSS 👍👍👍

[twainprod]

Прикольный видос, спасибо! Сохранил себе! Из всех фишек знал про иконку сайта и гриды, адаптивное меню делал через Bootstrap, а переменные в CSS использовал в SASS.

[alexeffect]

Про гриды интересно, спасибо, даже коммент оставил)

[mykhailo]

Спасибо большое! Очень интересное и познавательное видео.
Бистро, очень информативно, а главное без воды. С нетерпением ждём новых видосиков ;)

[aleksandryushka]

Спасибо за отличное видео. Очень полезно.

[PashaRomanovich]

Спасибо за очень классное и познавательное видео!

[alexkolom]

После данного видео, хотелось бы видео по фронту, с обзором каких-либо фишек вроде нативного lazy load, переменных css и прочего, что сейчас нужно бы обязательно знать - но думаю харя треснет у меня)) Не могу найти - есть ли серия видео по Sass, и прочим инструментам фронта, кроме html/css/js
P.S. Еще бы так же узнать - какие нынче тренды в этой ветке так сказать)

[Herp_B_TaHkE]

Видео то неплохое, но новичок может и запутаться)

[amelianceskymusic]

8:30 — 16x16 — это минимальный размер favicon для десктоп, лучше делать по гайдам

[maxokream]

Расскажи плиз 🙏🏼 про приложения вебью и технологию эту очень интересно 🧐

[sergeyromanyuk]

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

[DimitarRad]

Какой-то нонсенс! scroll-behavior: smooth; работает в лисе нормально, а в хроме нет. В чем проблема?

[sergeypolovov]

Картинка с Box Model на 3:38, конечно, ничего общего с реальностью не имеет, box-sizing: border-box никогда не включал в себя margin, а в content-box не знаю как вообще могло получиться 220px в общем счете

[vladyslavloktev]

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

[reshenie]

onclick в div это каменный век, не пишите так. В script.js пишите = toggleMobileMenu;

[genrihkutz]

а разве css переменные всеми браузерами поддерживаются ?

[diekunstUA]

Автозаполняемый выпадающий список - в чем разница с селектом? не могу придумать где бы это было удобней. спасибо за видео.