CSS Display свойство. Разбираем типы отображения block, inline-block, flex.
HTML-код
- Опубликовано: 25 авг 2019
- В этом уроке разбираемся с типами отображения в CSS, а именно с display: block, inline-block, inline, flex. Дополнительно разберем как выровнять блоки с помощью flex (justify-content, align-items). Базовые и необходимые знания
css для начинающих, которые решили стать верстальщиками или веб-разработчиками.
не знал, что у Мармока есть канал по верстке
Лучшее объяснение свойства display на youtube!!
Worcester Souse рад слышать🙂
@@temofart не только на ютьюб, прохожу курсы платные там эту тему не понял, перечитал уже раз 5, а тут с одного видео все сразу стало ясно, спасибо!
@@user-lg5ze7vd4o чьи курсы, если не секрет??
ЧЕЛ,СПАСИБО ОГРОМНОЕ,ПРОДОЛЖАЙ В ТОМ ЖЕ ДУХЕ,САМОЕ ЛУЧШЕЕ ОБЪЯСНЕНИЕ ДАЛ,ЭТО ШЕДЕВР,ЖЕЛАЮ ПРОЦВЕТАНИЮ КАНАЛА!!!))Я наконец разобрался в том,что так долго не мог запомнить)Спасибо тебе!))
Лайк за "Тесто" - )) и еще один лайк за хорошие объяснение. Автору огромное спасибо!
ты просто сказка, за 1 видос понял то, чего не мог понять неделю, может не так объясняли или ещё чего, но я прям многое догнал всего лишь за одно твоё видео, спасибо
Спасибо очень помог всё просто и понятно! То как вы подаёте материал это самый лучший и наглядный способ для учащихся! Продолжайте !
Монтаж помогает расслабиться , спасибо за best tutorial
Кайф! Приятно разбираться в верстке под такие уроки :)
как же классно, спасибо тебе, удачи!
Спасибо! Это была самая понятная для меня подача!
помог понять тему, которую другие разжевать не могут, спасибо
Это самое понятное объяснение!!! Благодарю!
Четко, внятно, понятно. Спасибо!
Спасибо за видео! Приятно слушать, всё понятно.
Спасибо, за такое качественное объяснение
Большое тебе спасибо,легко понимаю твои уроки
под такую музыку прям и хочется заниматься!)
спасибо большое! Все очень доступно для понимания.
На Марсе классно) Спасибо за понятное объяснение.
Спасибо большое,повторила к собесу,зашло отлично!!!
Чувак, спасибо! Очень полезная инфа
многое понял, просто и доступно объяснил
очень развернуто , за это спасибо в двойне. посылаю лучи добра)
Зачем было в видео вставлять себя? Закрывает некоторые функции кода и примеров
лучи бобра тебе, ты оч крутой, надеюсь, ты никогда не забросишь это дело) спасибо
Очень доходчиво! Благодарю. Пошёл переделывать лендос )
Спасибо, все подробно и понятно!)
Красаучек, я с тобой за пару дней столько понял... Теорию сам читаю в инете, а тут свего рода практика. Сенк!
Спасибо✌️
Спасибо большое, так понятно все разложил!
Спасибо! Очень помогло в понимании!
Прекрасно!Благодарю👍
Бро, спасибо четко точно лаконично)))
Оч круто! Спасибо!❤
Ну несмотря на этого большое спасибо тебе, очень аккуратно обясняешь,,,!!!
Очень понравилось, спасибО!!
Круто объясняешь молодец👍
Очень полезное видео, всё понятно объясняешь, препод объясняет не так, приходится самому досматривать. Подписка и лайк однозначно !!!
Огромная благодарность!
На Марсе классно 🔥🔥)))
Спасибо!!! всё понятно
спасибо за объяснение
Спасибо большое ✨✨✨♥️
нет вопросов проста шикарная объяснение спасибо
sposibo otlichno obyasnil
Хорошее видео, лайк за нойза в конце
оч круто, респект
спасибо просто и доходчиво
Подписка. Однозначно.
Каеф, спасибо!
Лайк классно обьясняет
Спасибо!
годный контент 👍
super!! spasibo
Спасибо большое за доступное объяснение материала. Все очень понятно и просто :)
за пару сек я исправил ошибку блока кнопки посмотря твоё видео, ПОДПИСКА 🙃
Пасибо !
Спасибо большое, хи
однозначно лайк
Thank you
Спасибо.
голос как у мармока) пасибо, очень помог!
Спасибо
Спасибо, очень помог, все описано подробно, но мне кажется камера по среди экрана мешает
Давай так же понятно о JavaScript)
Спасибо, помог!!
👍👍👍👍👍
все отлично, только музыку нужно тише и без слов
За Нойза отдельный поклон
очень хорошее видео, бро. только не видно стили из-за вебки)
👍
Если бы я захотел создать рыцарский орден программистов, то ты бы заслуженно возглавил его. Я посмотрел меньше минуты видео И У МЕНЯ УЖЕ ПОЛУЧИЛОСЬ ТО ,С ЧЕМ Я БИЛСЯ ЧАСОВ 6, в то время как другие гайды ничем не помогали.
Счастья тебе и всего замурчательного~
Спасибо за такой отзыв😊🔥🤙
Спасибо))
Добрый день ! У вас есть уроки по JavaScript ? (интересуюсь созданием поисковика по сайту )
А если задавать max-height, как сжать текст, есть ли такая возможность?
Я бы хотел узнать, после изучения HTML и CSS нужно учить JS или PHP? Или вообще план обучения должен быть иным?А также, когда начинать учить Bootstrap или что то подобное? Заранее спасибо!
Когда знание верстки будет на хорошем уровне ты сам начинаешь понимать что тебе дальше нужно. А хороший уровень - это когда ты уже работаешь в компании либо стабильно берешь заказы на фрилансе по верстке. Прыгать в программирование раньше , чем освоил верстку нет смысла, мое мнение
@@temofart со знанием одной лишь верстки тяжело устроиться в компанию(((
@@user-fy2yl5ri3l Согласен, что не просто, но такие вакансии есть. Я сам пришел в компанию еще будучи просто верстальщиком, хотя на фрилансе выполнял заказы на WordPress . Об этом стоит рассказать больше, есть несколько путей развития. Либо пойти по пути Vue/React, либо научиться работать с CMS типа вордпресс. Каждый из вариантов имеет свои преимущества и недостатки. Но смысл в том, что все это невозможно освоить не научившись верстать.
Можно попросить сделать обзор как сделать адаптивное меню с бургером!?
Вот этот пырень понятно объясняет
капец Чарли Дэй знает CSS
Привет, подскажи пожалуйста, вот у меня четыре блока и я не хочу выстраивать из в одну строку, а хочу сделать два и два под первыми блоками, как это решить?
автор в конце ролика спрашивает на какую тему еще поговорить, не знаю актуально это сейчас или нет , хотелось бы посмотреть видео на тему меню сайта и все что с этим связано
Простите за глупый вопрос, если блочный элемент занимает всю строку как тогда float подстраивает их в одну строку
что за редактор кода у тебя?
Кто нибудь знает что за программа или дополнение через которую ты смотришь полученный результат как у автора ?
Live Preview
фанаты гуфа и центра сразу видно)
11:50
!!!
добавь код блоков что бы скачали . У меня не работает ((((
+
Подскажите, у меня 9 маленьких блоков в одну строку. Как сделать чтобы при уменьшении браузера, те блоки которые не влазят= скрывались ???
Свойство overflow-x скрывает все, что выходит за пределы элемента.
@@temofart Ого как оперативно )) Спасибо. Но появилась проблема, он просто обрезает блоки по краям. А хотелось бы чтобы чтобы он их целиком не показывал если не влазеет .
В вёрстке такой возможности нет. Но и сам вопрос звучит необычно, возможно нужно другое решение. Например, чтобы в адаптивной вёрстке все влезало, а не пропадало) или с помощью медиа запросов можно описать поведение всех блоков на каждом этапе, даже если нужно их по очереди убирать
@@temofart Просто передо мной стоит задача - Разместить 12 (маленьких) блоков во всю ширину экрана одной строкой. Нельзя использовать js, только css и html
При изменениях экрана все должно работать корректно, блоки растягиваться на
всю ширину, а те, что не влезают - скрываться. Ничего подсказать не можете ?))
@@temofart А если написать flex-wrap: wrap; (то есть перенести все что не влезает на вторую строку, а вторую строку скрыть )Так получится ?
Очень хотелось бы знать : как и в каких случаях текст влияет на размеры блока и как он (текст) может менять эти размеры?
капец иван ургант второй канал открыл
прикольно, но почему квадратик с вашим лицом заслоняет весь код css) но про флекс всё доходчиво! спасибо лайк
Я старался, чтобы нужный код было видно. Но в любом случае это первые видео, дальше я изменил подход)
Спасибо, но было бы лучше без фоновой музыки, мое мнение.
Спасибо. Видео в ютубе - творчество, поэтому хочется делать так, как нравится. На любое творчество найдутся те, кому нравится - а кому нет)
Sweating Поддерживаю комментарий. Музыка очень мешает и отвлекает. Без неё было лучше.
Это вообще странная мода, ставить музыку фоном, при объяснении важных принципов.
Музыка держит в тонусе, скучно же. Я, например, работаю под музыку, решая сложные задачи, как и многие мои коллеги. А в офисе столько посторонних звуков, что музыка будет лучшим вариантом среди них, нужно научиться фокусироваться на задаче отключая в голове все лишнее)
Его Вебкамера мешает я не вижу часть кода CSS
Попробуй найди другое видео по этой теме
А где grid, flow layout
3 года назад использовать в продуктовых проектах гриды было рано, а новичкам знать все сразу необязательно.
Привет братан, извини, но flex-direction:row, column, row-reverse, column-reverseвсё про этих фишек забыл говорить!!!!
фон громковат
ничего не поняла
Ты случаем не брат мармока?
Та не похожи мы )
@@temofart но голос ощущается :>
Ну ёёёмаё, нам видос нужен а не ты)))) Весь код перекрыл лицом, ппц.
Зачем тебе код? Он объясняет для чего нужен код, ты должен быть уже с ним ознакомлен.
@@kuskauu2946 Капец ты Эйнштейн.
@@MaratHighlanderУдачи по пути програмиста)
Ничего не понятно