Полноэкранный (fullscreen) блок на CSS и HTML // Как это сделать?

Поделиться
HTML-код
  • Опубликовано: 28 ноя 2024

Комментарии • 367

  • @FreelancerLifeStyle
    @FreelancerLifeStyle  4 года назад +59

    🔴 Ну как, полезно?
    Получить доступ к плюшкам + поддержать канал: www.patreon.com/freelancerlifestyle
    Telegram канал: t.me/freelancer_lifestyle или teleg.run/freelancer_lifestyle
    Telegram чат по верстке: t.me/flschat (teleg.run/flschat)
    Instagram: instagram.com/freelancer.lifestyle/
    Facebook: facebook.com/freelancerlifestyle/

    • @Ibrohim021
      @Ibrohim021 4 года назад

      Здравствуйте, а можно видосик о кроссбраузерной верстке как и что как одаптивить под интернет экплеэр

    • @vladyslavisyp539
      @vladyslavisyp539 4 года назад

      Здравствуйте, подскажите пожалуйста, как вы пишете код(команду) на русском потом нажимаете кнопку и оно превращается в нормальную команду html или css.

    • @svhanz
      @svhanz 4 года назад

      @@vladyslavisyp539 Где вы видели на русском запись команды? Евгений набирает текст команды, а вот потом класс/тег или как там правильно, добавляется сам. Мне эта фича тоже понравилась, но скорее всего это софтина такая.
      Вот это надо выяснять, я так понимаю.

    • @svhanz
      @svhanz 4 года назад

      @@vladyslavisyp539 Нашел. Это VSC

    • @AlinaDotsenko-d6q
      @AlinaDotsenko-d6q 4 года назад

      @@vladyslavisyp539 Это Punto Switcher

  • @ob7349
    @ob7349 3 года назад +1

    Дякую)))) Блін, раз за разом прокручую свою сторінку, любуюсь)))))

  • @Pro10056Bah
    @Pro10056Bah 4 года назад +29

    Смотрим))) Огонь, очень полезно, спасибо за Ваш труд.

  • @aleksei-demon9814
    @aleksei-demon9814 4 года назад

    Повторял за тобой весь урок.
    Когда своими руками проскроллил "параллакс", аж захватило дыхание!

  • @Alexander-yr8ul
    @Alexander-yr8ul 4 года назад +11

    Спасибо Вам за то что Вы делаете: за позитив, подачу материала, мотивацию. Спасибо.

  • @alexgenesis6556
    @alexgenesis6556 3 года назад +1

    Спасибо огромное. Благодаря Вашему каналу я учусь быть лучше с каждым уроком.

  • @ДмитрийС-д2щ
    @ДмитрийС-д2щ 3 года назад +3

    Очень классно! Код написан изящно, ничего лишнего(как говорит Жека никаких танцев с бубном).
    Миллиард миллионов тебе в подписчики!

  • @endurenzmusic6617
    @endurenzmusic6617 4 года назад +2

    Ппц ты крут ! А главное и я от этого круче становлюсь . столько всего нового узнала смотря твои видео .

  • @alex45779
    @alex45779 3 года назад +3

    Спасибо за Ваши исследования! И что делитесь знаниями!

  • @AlexZHIMuk
    @AlexZHIMuk 4 года назад +3

    Чем дальше, тем интереснее и интереснее. Спасибо. Очень нужные вещи и очень понятным языком!

  • @morozoff1996
    @morozoff1996 4 года назад +1

    Женя, ты как всегда вовремя! Не так давно верстал макет, где было несколько фуллскриновых блоков. Самостоятельно и правильно у меня сверстать не получилось, но благодаря этому уроку я могу сделать работу над ошибками. Благодарю!

  • @zmeygorynych5684
    @zmeygorynych5684 4 года назад +1

    Урок бомбический, решил сверстать binary из твоего марафона, там фулскрин картинка первая. Сразу на этом затормозил, обратился к этому видео и вуаля, "теперь я знаю, как это сделать". Евгений, спасибо за труды)

  • @РоманНазаров-г2ц
    @РоманНазаров-г2ц 4 года назад +3

    Отличное преподнесение материала, все по делу! Очень жду новых роликов! Огромное спасибо, за то что делаете!!!

  • @АлексейМихеичев-е8й
    @АлексейМихеичев-е8й 4 года назад +4

    Эффект с прокруткой фона это вообще бомба!!!

  • @art-avetyan
    @art-avetyan 4 года назад +5

    Спасибо! Очень методично и понятно. Классная подача для самообучения. Приятно слушать и выполнять все этапы урока.

  • @КириллТимофеев-п1л
    @КириллТимофеев-п1л 4 года назад +2

    Благодарим, смотрим и комментируем!

  • @ВладЛитвин-с6д
    @ВладЛитвин-с6д Год назад

    вот это твое появление из тумана прям класс) урок полезный!

  • @ИванПетров-б9д5з
    @ИванПетров-б9д5з 4 года назад +2

    Женя супер!!! Молодчик!! Пора идти поддерживать канал...))

  • @diko5975
    @diko5975 4 года назад +3

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

  • @aleks-ts
    @aleks-ts 4 года назад +9

    Круто, Женя, спасибо, еще не смотрел, но ставлю лайк! Пока по порядку видео смотрю)))

  • @Volia-sv7
    @Volia-sv7 4 года назад +4

    Большое спасибо! Очень полезный классный урок! Здоровья и успехов Вам!

  • @romanrrv
    @romanrrv 3 года назад

    Спасибо! Мучился с такой вёрсткой. Теперь всё понятно

  • @AlinaEmv
    @AlinaEmv 2 года назад +1

    Просто ВАУ!
    Супер полезный урок, как и все собственно на канале))))

  • @ulanbakytov2564
    @ulanbakytov2564 4 года назад

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

  • @lera6580
    @lera6580 4 года назад +8

    *Я в восхищении* (с) Кот Бегемот
    Очень бы хотелось ролики на эту тему с прокруткой на js. Интересно будет именно в твоем исполнении посмотреть.
    *яростно тыкает "нравится"*

  • @АлександрШвец-г4з
    @АлександрШвец-г4з 4 года назад +2

    Как обычно на высоте!

  • @wvvwersus
    @wvvwersus 10 месяцев назад

    Отличный ролик! С помощью него таки удалось сделать фулскрин на макете, который идет к видео о БЭМ! Спасибо за отличные обучающие видео!

  • @nikola-san
    @nikola-san 4 года назад +2

    Просто и со вкусом. Класс !!

  • @loralinda4398
    @loralinda4398 4 года назад +2

    Офигенно, супер, так доступно. Спасибо -Ты лучший.

  • @ПользовательСети-г4у
    @ПользовательСети-г4у 2 года назад +1

    Круто! Спасибо, теперь я знаю, как сделать fullscreen. Особенно спасибо за позитивный текст) Мотивация очень нужна в наше время

  • @ВладимирЗюзюкин
    @ВладимирЗюзюкин 4 года назад +3

    Как всегда!!!
    Отличное видео!!!!!!!!
    Спасибо!

  • @GrifanoRide
    @GrifanoRide 4 года назад +1

    Ох Женя) С языка сорвал про физику перехода на следующий экран по кнопке) Как всегда лайк, и спасибо)

  • @arseloned3834
    @arseloned3834 4 года назад +1

    Очень благодарен тебе человек, твой канал для меня большая находка, продолжай !!!

  • @TheMuxacb
    @TheMuxacb 4 года назад +8

    Жека, большое спасибо за видосы. Учусь у тебя. Очень хотелось бы посмотреть на твою реализацию полноэкранной прокрутки с JS (если можно, то не только вниз-вверх, но и вправо-влево)!

  • @KuKu_RuKu88
    @KuKu_RuKu88 4 года назад +1

    Жень, спасибо !!! Все подробно и классно изложено !!! Как всегда )))

  • @ТетянаПересипкіна
    @ТетянаПересипкіна 4 года назад +1

    Спасибо. Главное, что объясняется очень понятным языком.

  • @vadimrex6784
    @vadimrex6784 4 года назад +4

    Круто! Спасибо, Женя!!!
    Я сейчас, как раз верстаю фул скрин)

  • @relaxing_sounds_zen_meditation
    @relaxing_sounds_zen_meditation 4 года назад

    Очень вовремя вы открыли ваш прекрасный канал! Как раз как я заинтересовалась версткой. Спасибо!!

  • @dmitrid.317
    @dmitrid.317 4 года назад +2

    Как всегда на высоте!

  • @konstantinreut2577
    @konstantinreut2577 3 года назад

    Благодарочка, Женя!)

  • @СвятославПупырев
    @СвятославПупырев 4 года назад +2

    Респект. Очень полезно. Жду продолжения. Жека, ты лучший!

  • @АртемКа-в3к8й
    @АртемКа-в3к8й 4 года назад +4

    Спасибо Жек, полезный урок, я с этими фуллскринами часами седел))

  • @NataOnion
    @NataOnion 4 года назад +2

    Очень-очень крутой контент!! Ждем других видео!

  • @badenglishcooljs8233
    @badenglishcooljs8233 4 года назад +1

    Какой же ты крассавчик...

  • @serg1000serg
    @serg1000serg 4 года назад

    Очень полезно!!! Очередная благодарочка!!!

  • @АндрейСарга
    @АндрейСарга 4 года назад +1

    Женя Спасибо!!!! Еще применил к нему твои наработки по адаптивному шрифту и получилось вообще Мега Круто!!!!

  • @ЕгорИваницкий-я2п
    @ЕгорИваницкий-я2п 4 года назад +2

    Круто, спасибо! Все видосы огонь просто🔥 информативность зашкаливает, подача тоже)

  • @xtapofficial6732
    @xtapofficial6732 4 года назад +2

    Спасибо огромное! Очень классный канал! Отличное объяснение-яркое и понятное!

  • @КонстантинЛукьянов-ю1ж

    Как всегда очень интересно, спасибо ))

  • @grommaks
    @grommaks 4 года назад +1

    Отличная тема, добавил себе в очередь :) лайк однозначно 👍

  • @egorkomarov4719
    @egorkomarov4719 4 года назад +2

    Мастер! От души!

  • @синийкот-р6щ
    @синийкот-р6щ 3 года назад

    Хочется снова и снова поставить лайк (конечно же лайк стоит уже..) Честно, учусь и с каждым разом всё больше и больше Благодарен Вам за то, что такого Безценного контента нет! И к тому же, раз это всё Отдаётся Бесплатно, то конечно это Дар! Дар и может быть Окно Возможностей, для кого-то! А для меня так точно. Спасибо Вам,Удивляющему и Удивительному Человеку!

  • @andyrey840
    @andyrey840 4 года назад +1

    Круто, давно ждал такой видос!!!

  • @proreshala5680
    @proreshala5680 4 года назад

    Крутое видео! Женя большой молодец! Так держать!

  • @ВиталийРябенко-з1ь
    @ВиталийРябенко-з1ь 4 года назад +1

    Спасибо большое!
    От значка ГТО - к олимпийской медали !!! )

  • @yuriismakota9574
    @yuriismakota9574 4 года назад +1

    спасибо огромное за урок! как всегда, все на высоте!

  • @cheesecheesson9842
    @cheesecheesson9842 4 года назад

    Молодец! Спасибо тебе огромное за всё, что ты делаешь!!! Удачи тебе, здоровья и благополучия!

  • @Jesus.On.Extasy
    @Jesus.On.Extasy 4 года назад +1

    *Спасибо за инфу* 👍

  • @АлексейЮжаков-л8ш
    @АлексейЮжаков-л8ш 3 года назад

    Жека, урок огонь!

  • @Denis-t2m
    @Denis-t2m 4 года назад +2

    Супер! Большое спасибо, увидел много интересующих нюансов

  • @armenakcomp
    @armenakcomp 2 года назад +1

    Все получилось, круто и полезно. Спасибо! 😉

  • @HA_CTPIME
    @HA_CTPIME 2 года назад

    Як завжди. Корисно i якiсно.

  • @yres1399
    @yres1399 4 года назад +1

    Свежо, интересно, полезно - спасибо!

  • @гоблинвася-п7о
    @гоблинвася-п7о 4 года назад +1

    Очень полезно, очень нужно, очень ждём дополнение с прокруткой)

  • @ИгорьГорбунов-ю9ж
    @ИгорьГорбунов-ю9ж 4 года назад

    Благодарю Вас за видео.

  • @АдхамЭсанов-в6т
    @АдхамЭсанов-в6т 4 года назад

    Я это 16мин видео смотрю час и пишу код,который он написал.
    Спасибо Женя

  • @СофьяЛипунова-й4ж
    @СофьяЛипунова-й4ж 4 года назад +1

    Круто! Оказывается так просто. Спасибо за инфу!

  • @vladovcharov517
    @vladovcharov517 4 года назад +1

    решило ряд моих проблем спасибо, Жека как всегда на высоте)

  • @iventeye
    @iventeye 4 года назад +2

    Полезно! Спасибо!

  • @Katyachaya13
    @Katyachaya13 4 года назад

    Как всегда отличный выпуск. Спасибо

  • @777bujhm
    @777bujhm 4 года назад +1

    Спасибо Женя! как всегда на высоте, у тебя крутой контент))

  • @AlinaDotsenko-d6q
    @AlinaDotsenko-d6q 4 года назад

    Очень полезно, спасибо! Теперь я не только могу создавать fullscreen, но и знаю какой это терракотовый цвет 😀😆

  • @delawar.
    @delawar. 4 года назад +2

    Зачет. Было бы неплохо сделать рубрику от верстки лёгкого макета к сложному :). Всегда респект.

    • @FreelancerLifeStyle
      @FreelancerLifeStyle  4 года назад +1

      Верстки макетов уже есть и будут еще, разной сложности

  • @FXUNDPLXGG
    @FXUNDPLXGG 3 года назад

    Не то что я искал но тоже полезно

  • @no_name_2mix
    @no_name_2mix 4 года назад

    Отличное видео! Спасибо!

  • @nikitagarchellios629
    @nikitagarchellios629 4 года назад +2

    Спасибо тебе большое!

  • @maksacool
    @maksacool 4 года назад

    Огромное спасибо за видео

  • @TheChaluy
    @TheChaluy 4 года назад

    Як завжди топ) Спасибі, Женя!

  • @Максимка-ц8г
    @Максимка-ц8г 4 года назад +1

    Как всегда ТОП)

  • @rustamal3kb3rov39
    @rustamal3kb3rov39 4 года назад +2

    Жека спасибо за урок , как раз вот верстал макет с полноекранными блоками , но делал это по кривому . Спасибо ты просто лучший .

  • @Noroyami
    @Noroyami 3 года назад +1

    Спасибо . Это просто понятно и без воды . Попробовал основу из увиденного применить на гридах . Оказалось все гораздо проще чем думал . Спасибо большое :) будут ли уроки по css grid ?

  • @vahe.hayrapetyan
    @vahe.hayrapetyan 2 года назад +1

    Очень помог! Лайк

  • @yonjoo8258
    @yonjoo8258 4 года назад

    Крутняк! я вот прямо вот это искал последнюю, ну фиксацию

  • @МаксимРыжиков-ы1п
    @МаксимРыжиков-ы1п 4 года назад +1

    Ооооочень хороший урок, а фича с параллаксом 🔥

  • @dooleanoff
    @dooleanoff 7 месяцев назад

    Если у вас секция/блок, которая должна быть фуллскрином идёт после шапки или же другого статичного блока до фуллскрин секции, вместо min-height: 100vh пропишите min-height: calc(100vh - 70px), где 70px - это высота блока или шапки до полноэкранной секции

  • @vladimirilintcov6924
    @vladimirilintcov6924 4 года назад

    Спасибо за контент)

  • @СергейТерещенко-р8н
    @СергейТерещенко-р8н 4 года назад +2

    Спасибо большое.

  • @МаксимКруковец-ю2э
    @МаксимКруковец-ю2э 3 года назад

    Супер! Спасибо

  • @dimaburichin7726
    @dimaburichin7726 4 года назад +2

    Боже как раз искал нормальное решение создание таких блоков 100000000000 лайков!!! Скачал себе в библиотеку!

  • @ОксанаХарченко-д9г
    @ОксанаХарченко-д9г 3 года назад

    Спасибо, полезная ифнормация:)

  • @BLGamesChannel
    @BLGamesChannel 4 года назад +2

    Отлично! Как раз делаю дизайн сайта, сделаю с прицелом на фулскрин блоки и сверстаю!)

  • @ПетровськийВіталій

    БРАВО аплодисменти автору

  • @diatm1506
    @diatm1506 3 года назад

    Спасибо огромное всё работает! У меня 3 слоя было background выше градиент ещё выше слой текст и тд)

  • @al77ex1
    @al77ex1 4 года назад +3

    Отличный ролик! Я думал тут без JS не обходится :)

  • @ДаниярДосыбаев-г1о
    @ДаниярДосыбаев-г1о 4 года назад +1

    Очень полезно бро, респектос

  • @ramilnazmiev9448
    @ramilnazmiev9448 4 года назад +1

    спасибо от самой души

  • @AlekseyNaumov_734
    @AlekseyNaumov_734 2 года назад +1

    Супер!

  • @MrByte-le9is
    @MrByte-le9is 4 года назад +28

    Привет Жек, спасибо за уроки. Новый видос - лайк сразу же
    Будет ли у тебя на канале WordPress, на фриланс биржах в основном только по нему заказы(Пытался учится у других блогеров но они походу сами не знают о чем рассказывают)
    P. S. Я твой патрон (Никому никогда до этого не донатил, и не оформлял подписку)
    Еще раз спасибо "И помни - Живи, а видосы снимай в свободное время"))

    • @FreelancerLifeStyle
      @FreelancerLifeStyle  4 года назад +11

      Ахах, спасибо! Да, WP будет!

    • @Fominprogolf
      @Fominprogolf 4 года назад

      Полностью согласен, и меня затянула приятная рутина!)))

    • @svet0v
      @svet0v 4 года назад

      привет не подскажешь материалы по которым лучше учить вордпресс?

  • @freeze174fm
    @freeze174fm 4 года назад

    Спасибо! Действительно крутой и полезный контент! :)

  • @НиколайТвердохлеб-э1ш

    Жека ти найкращий!