Топ-7 фишек HTML/CSS верстки сайта которые ты должен знать
Вставка
- Опубліковано 14 чер 2020
- Мы продолжаем рубрику улучшаем код и в этом видео мы поговорим про топ 7 фишек html css для верстки сайта, котоые вы должны знать. Верстка сайта на самом деле не такая сложная как кажется на первый взгляд, да и html css кажется для начинающих темным лесом. В этом видео я покажу как легким способом сделать паралакс эфеект на вашей странице, добавить анимации CSS и многое другое, что поможет вам в дальнейшем быстрее верстать и применять в своей работе.
Cirklе - это сильно))
Злорадствуете, уважаемый
Кратко о моем уровне английского)
rigt 😬
О, да вы из англии
Sirckle же!
Пишите комментарии, все читаю и отвечаю ✌🏻
Можно центровать в 2 строчки. Контейнеру display: flex; флекс-элементу margin: auto; =)
Самолайк - закон успеха.
Для это всего библиотеку script.js обязательно подключать? У вас на видео подключена
Max Bondarenko ни для чего, в этом видео можете не подключать, то с прошлых уроков осталось
братан спасибо тебе, я узнал что можно написать вместо background-size bs)
очень крутое видео! Я пока начинающий верстальщик и этим свойствам меня не учили) поэтому анимации, полупрозрачное наложение - это для меня как магия))
было бы круто, если бы такие видео выходили чаще)
Видео снова огонь . Все четко и понятно , ещё бы таймлайн под видео или хотя разбивку по темам с указанием времени и пару тем в названии о чем будет разговор в видео чтоб оно не утонуло в закладках с одинаковыми именами и было сразу видно и легко найти интересующую фишку. Лайк
За clip-path - лайк! Всю жизнь для задач с необычными формами блоков с картинками просто использовал png, теперь смогу делать поинтереснее!)
я тоже! спасибо автору, годный видос!
Да, реально спасибо!
Лучше я не видел. Постарался и изложил кратко и доступно. Конечно же продолжай делать так хорошо и дальше)
Очень крутой подход, информация прям зашла как нужно!
Хочется увидеть урок, про стилизацию форм (radiobutton, checkbox, text) ввод формы данными и отправка заполненных данных юзером себе на почту или телеграмм. Перекопал внятного ничего на эту тему не нашел. Спасибо за урок!!!
Рубрика пушка!🦾
Спасибо за труд! Пили ещё!🙌🏽
Ого!!!
Про анимацию реальный респект)))
Сделай в следующем видео переходы (like transition)
Большое спасибо вам! Недавно начал изучать html/css/js, я думаю это поможет. Продолжайте делать такой контент!
Как продвижения в изучении?
Очень крутая рубрика! Спасибо, ждём ещё!!!
Спасибо. Реально нужная и ценная информация. Просто, быстро и понятно! Удачи!
Спасибо 🙏🏻
Спасибо за clip-path, все ясно и понятно и ничего лишнего в видео, а то у других такое на час растягивают.
Ага)) какие-то цифры делают что-то))
Настоящий трудяга - почти в час ночи видео вышло.
Ага, заслуживает лайка
Спасибо! Емко и полезно. Для начинающих(типа меня) - просто фантастика.
Лайк! Без воды все четко, быстро
Класс! Побольше надо таких уроков ) Респект и уважуха за инфу!
Очень круто! Побольше бы такой тематики!
Больше бы таких видео.СПАСИБО ЧТО ДЕЛИШСЯ С НАМИ ЗНАНИЯМИ for free.
Много полезной информации. Спасибо!
Спасибо большое за это видео. Мне как начинающему очень интересно и полезно!
Ого, топовое видео, спасибо большое! Начну применять фишки
Топчек.Спасибо за видосик, удачи!
Спасибо большое, очень хороший контент и подан качественно.
Зачётно продемонстрировал! Заслуженный Лайк👍
лучший канал, всем советую. Вот только многие ролики уже старые
Полезные примеры, спасибо!
такие видосы как всегда пушка, добавил к себе в закладочки
У clip-path подержка не очень пока, а так свойство классное, что касается пункта #5 то для лучшего эффекта, обернуть картинку в блок, задать ему размеры и overflow:hidden и так же картинки добавить плавности через transition. Будет намного круче смотреться )
Пасиб, как раз во время.
Просто и понятно. Супер. Давай ещё
Очень полезная информация, спасибо
Какие классные у тебя видео 👍🏻👍🏻👍🏻 Не понимаю, почему люди не ставят лайки. Можно потрудиться и коммент оставить. Мне кажется, твой контент того стоит!
Спасибо, достаточно познавательно, много для себя нашел
Сначала лайк, потом смотрю!
отличный фармат видео, для новичков самый раз!!!!
Спасибо. Очень полезные ролики. Без воды и всё понятно.
Хочется узнать про особенности использования svg картинок. Никак не доберусь самостоятельно.
Приму к сведению
Это видео невероятное, спасибо
Класс! И к черту плагины- анимашки, все ручками и головой можно сделать 👍👏
К черту флексы, пойду на таблицах делать)
Чуваки ставьте лайки, а не просто смотрите. Просто человек старается, а так вяло набираются лайки как бы тафталогично это не звучало. Тем более информация то полезная.
Спасибо! Рубрика классная! Продолжение будет весьма актуально.
Ооооо, как нибудь сделаю
Шикарно. Спасибо.
Харош, терь будет более интересный сайт для екзамена :) Спасибо и продолжай )
Топчик контент👍 Спасибо!
Спасибо за Clip-path помог)
Отличный выпуск.
Круто, спасибо!
Лайк
you are cool/ больше бы таких видосов
Очень круто ! 😄
Да были неточности в видео, но спасибо за старание и труд, продолжай в том же духе!
Спасибо большое за видео! очень помогло
Оч круто, спасибо🙏👍
Ставлю 1000 лайков и жду продолжения :) 😄
Крутое видео, спасибо!
Красава
Хорошая серия роликов, спосибо 😊👍🔥
Супер
Лови лайкос, амигос, фишки супер!
Замечание по №6: можно было transform-duration указать для transform: scale(1.3)), чтобы изображение "не прыгало", только указывать на селектор элемента, а не на :hover
#6 отсутвует
Круто спасибо.
Хороший урок👍👍👍
думал старое видео смотрю, а тут оно только недавно вышло
5 копеек по поводу анимации. Вместо left/right где это возможно лучше использовать transform: translate. Это избавит от ненужных repaint/reflow.
Привет я новичок в программировании изучаю Django, но понимаю что без html и css нормально сайт не сделать
Но не понимаю как соединить например Django и html+css , или так же с JS, буду рад любому ответу:)
Вопрос тупой конечно для опытных, но все с этого начинали, а так как ты очень опытный в веб разработки, принять информацию от тебя будет очень полезно))
Друг, ты пользуешься граф. редакторами типо Avocode или Zeplin? Или только фотошоп?
Годно!
Идеи на следующий выпуск:
1. Shape-outside
2. Offset-path
3. Сделать кастомные input.
4. Inset
5. Transition. Ты про анимацию рассказал, а про переходы нет.
как сделать кастомный select без готовых вариантов. чтобы изменялся даже dropdown
плюсую кастомный input
@@user-hw1bi2qc7m ::before и ::after вам поможет
+кастомные input и всякие чекбоксы
лучше кастомизацию input type="date"
круто, подписался!
Классный видос, делай больше таких
Хорошо
интересное видео, спасибо
Огонь!!))
Просто коментарий для продвижения видео в топ
Класс, я об этом уже знал)😅
Клас продолжай , я узнал много
Ты лучший)
зачет!!!
Очень интересно. Хочу єщо
спасибо!
Спасибо
Спасибо. Смотрю я на это и приунываю. Вроде все и предельно понятно и непонятно сразу. Очень надеюсь за 3 месяца освоить html и css чтобы хоть зацепиться и начать работать за еду
Ну как ты? Освоил?
Respect!
спасибо!))
0:34 что за тема с голубой подсветкой? очень понравилась! Красный с зеленым уже достали везде((
Лучший
Чувак ты топ спасибо тебе
Спасибо
Найс, пасиб
Супер.
спасибо)
Продолжай эту рубрику, очень полезно. В ближайшее время планируется ещё один видео курс по вёрстке?
Что то у тебя вдохновение пришло ) или курсы готовишь на юдеми ?)
И то и другое
прикольна рубрика
спасибо помог)
cirkle😂😂
круть)
Спасибо, советы очень полезные и решения таких ситуаций всегда пригодятся. Но мне кажется, было бы полезно расширить эту тему и показывать, как эти решения сделать кроссбраузерными. А вообще, лайкос!
А это нормально, что привстает от уроков этого парня? Бомбический контент
Привет, классное видео, прям сижу повторяю сразу, но почему-то не получился polygon и масштабирование при наведении, хотя повторяла вс' точь в точь((
Анимацию передвижения объекта лучше делать через transform, а не через позиционирование (top, left). Иначе может кое-где подлагивать
Заявлялось, что скорость прокрутки заднего плана будет меньше, чем у переднего. Это подразумевает, что задний всё-таки будет скроллиться, а он встал неподвижно. Спасибо, конечно, но не совсем то, что было заявлено. Можно ли его всё-таки запустить, но медленнее?
В остальном здорово!
крутое видео
Побольше видосов с фишками! 👍
Окс
А можно ли для №3 ефекта использивать z-index для наложения текста на фото?
Прикольно но быстро очень рассказал и примеры на верстке есть( урок видео)!?