LESS за 50 минут | Учим препроцессор LESS
В этом уроке изучим препроцессор LESS. Вы научитесь работать с препроцессором LESS и использовать его возможности для верстки сайтов.
// Ссылки =================
Сайт LESS: lesscss.org/
Материалы урока: files.brainscloud.ru/file/pre...
// О проекте =================
Меня зовут Дмитрий Валак. Я занимаюсь разработкой сайтов уже много лет, специализируюсь больше на front-end разработке и верстке сайтов, но и программирование тоже изучаю. Здесь буду делиться с вами информацией на разные темы по веб-разработке - HTML, CSS, Javascript, JQuery, Vue, PHP, MySQL, React, Gulp и тд.
На сайте проекта brainscloud.ru вы найдете много полезных закрытых материалов, а так же сможете поработать со мной лично, при наличии такого желания.
// Соц. сети =================
Мой ВК - odimaz
Группа BC - brainscloud
Мой Instagram: / dmitryvalak
#less #css
Пікірлер: 116
Лови новый видос! Лайк поставил? На канал подписался?)
@vadim1907
5 жыл бұрын
Спасибо, очень информативно
Конец 2019, а видос на эту тему самый полезный. Спасибо автору!
Ураааа!!!! Димон снял видос про препроцессор LESS - пошел делать кофе и смотреть!Спасибо!Лайк!
Доступно и просто объясняете. Очень спасибо!
Вот настолько интересное видео, что когда появляется реклама, хочеться посмотреть их хоть 3 штуки, чтобы пользу автору принести, хоть какая-то отдача )) P.S - Спасибо огромное, начал смотреть видео с портфолио, понял что нужно учить less, сижу учу, пока не выучу, портфолио не трону, ты просто лучший, спасибо большое.
@mirov17
Жыл бұрын
как успехи?
Як завжди на висоті! дуже корисно. Дякую за працю!
Спасибо! Очень нравятся Ваши уроки. Обучаюсь по ним эффективно.
Дмитрий, спасибо большое за этот урок! Приятно слушать, доступно и просто объясняете. Подписываюсь на канал))
Мощно) без всякой воды и 5 секундных раздумий))
Спасибо Дмитрий!!! Очень полезная информация!
Огромное спасибо за данный ролик, самый информативный и полезный из всех, что я смотрел по данной теме!
Даёшь урок по SASS
спасибо, кратко и доступно для понимания
просто супер. очень доходчиво объясняешь. грех не поставить лайк
Спасибо за урок! Особенно за сетку)))
спасибо за познавательный контент, в школе вкинули блок с less до js и немного путаница возникла из-за сжатого формата, а тут автор все хорошо и понятно с визуально приятной практикой объяснил.
Спасибо за хороший урок!
Спасибо за видео, очень понятно и полезно!
Первый туториал, который не приходится слушать в ускорении. Лайк за скорость)
Очень полезное видео, спасибо!
Как раз сегодня начал юзать препроцессоры и тут твой видос )
Сделай верстку с нуля с использованием препроцессоров и gulp или webpack =)
Топовые обучалки!
Очень доступно объясняешь! Повторяю комент: "Сделай верстку с нуля с использованием препроцессоров и gulp или webpack =)". Например, ActiveBox продолжение:)
🌟🌟🌟🌟🌟 *TOP!!! Сложные вещи простыми словами!!!* 🌟🌟🌟🌟🌟
Уай! Уай! Братюня супер видос дорогой!
Спасибо вам! Приятно слушать. Все четко и грамотно, тембр голоса ласкает уши. Думаю буду еще ни раз пересматривать это видео! :)
очень круто!)))
Крайне редко видел чтобы на тысячу лайков был один диздайк)) Дмитрий как всегда все четко и по делу. Спасибо!
Спасибо!
Всё повторила . Нормас !
Конечно Лайк!!!
44:00 не работает почему то, .grid(@columns); подчеркивает красным, говорит ошибка
@user-xi2xh4yr9k
2 жыл бұрын
Error evaluating function `percentage`: argument must be a number
@user-xi2xh4yr9k
2 жыл бұрын
У меня работает, если: "width: percentage((@i / @columns), rem);"
@user-hr6qc8rg4w
2 жыл бұрын
тоже не работает
спасибо, очень полезно.
Препод в универе не объяснил, хоть ты объяснил, спасибо)
Дмитрий добрый вечер :-) С Brackets у меня не получилось. Мой редактор в упор не видит этого расширения. Но зато в Vs Code получилось :-) Устанавливаем Vs Code в него расширение Easy Less. И радуемся его безукоризненной работе. Компилирует less файлы в css файлы при сохранении.
это просто супер!!! спасибо от души!)) я начал с less,он мне понравился, и не хочу идти на sass(менять шило на мыло...). но по Less на "ру" пространстве, вменяемое сложно найти...((
спасибо большое.... было бы интересно где ты берешь заказы - fl, upwork и тд?
Спасибо
812 лайков и 0 дизлайков это реальная оценка видео. И добавить нечего)
@BohdanVR666
3 жыл бұрын
За год 1.2к лайков и 1 диз
Здравствуйте! Спасибо вам за видео уроки, скажите пожалуйста есть ли альтернатива avcode?
Спасибо за видео.👍 Есть вопрос. Если на оборот, как сжатый цсс развернуть? Если его сжал кто-то другой.
Спасибо за урок! А как сделать, чтобы медиазапросы работали в хроме?
Сделай пожалуйста мини урок как подключить LESS к Sublime Text
Так получается можно в начале всех "вспомогательных" less файлов ставить нижнее подчеркивание и тогда не понадобится писать строку main: и удалять файл css? А в @import "blocks/_btn" писать или без нижнего подчеркивания?
супер
👍
Спасибо Дмитрий! У Вас после настройки LESS AutoCompile после создания style.less создаётся style.css, а у меня не создаётся. С уважением к Вам Ахмад
Пользуюсь less только для вложенностей в селекторах =)
Спасибо большое за видео а как сделать адаптивность чтобы при маленьком экране объекты встали в колонку?
@BrainsCloud
4 жыл бұрын
посмотрите курс по верстке сайта на моем канале
Понятно, что видео выложено давно, но я посмотрела только сейчас и у меня появился вопрос. В рекурсивном цикле, так ли важна строка,где задается ширина столбцов, я ее закоментила и цикл все равно работает. И мог бы кто нибудь обьяснить как работает все это, ведь чем меньше столбцов, тем больше должна быть их ширина в %, а тут совсем на оборот.
У меня в сss файле коды не сжимается но index.html компилирует css код! Что делать??? Попробовал в Sublime 3 и в brackets безполезно ...( Можете посоветовать Дмитрий?
Я почти не ставил лайки видосам на ютубе, а потом наткнулся на этот канал....
Спасибо за видео! У вас есть видео как сверстать сайт со слайдингом из psd макета?
@BrainsCloud
5 жыл бұрын
посмотрите на канале плейлист по верстке сайта с нуля, в конце есть видео со слайдером, если вы под "слайдингом" имели это
Как ты меняешь быстро цвет в брекетс при наводе курсором мыши на "color:" ?
@BrainsCloud
4 жыл бұрын
ctrl + e
Здравствуйте, можете посоветовать книги по LESS?
Что за плагин который дописывает код fw700 - font-weight: 700; на 09:30 ? Спасибо! Сделайте обзор на этот редактор, вернее на плагины...
@BrainsCloud
5 жыл бұрын
Есть на канале, пару видео назад
@Dimarik9165
5 жыл бұрын
@@BrainsCloud Спасибо, невнимательно посмотрел!
@aleksandrkedria4024
5 жыл бұрын
Emmet
// compress у меня не работает. Не подскажите как это решить?
Расскажите пожалуйста как в Brackets установить HTML препроцессор Jade. И как им начать пользоваться.
@BrainsCloud
4 жыл бұрын
я такими извращениями не пользуюсь )
@developman-ai
4 жыл бұрын
@@BrainsCloud понятно, просто не знаете, а эти "извращения" требуют крупные компании на вакансии HTML верстальщика, вместе с LESS.
@vitalii4287
4 жыл бұрын
@@developman-ai А вы ,я смотрю, сходу в крупную компанию собрались?
@developman-ai
4 жыл бұрын
@@vitalii4287 да
не работает вставка @{img}...(( буду гуглить.)) а так, спасибо!)
Я установил все как есть на брекетсе но все равно лесс файл не работает
Спасибо сделаете пожалуйста видео по каким этапом стать версталчикм а то в сети много говно ты вроде достоверный)))
43:48 Если у вас не работает .grid(@columns); и выдает ошибку "Error evaluating function `percentage`: argument must be a number", то перепишите свойство "width: percentage((@i / @columns), rem);" P.S спасибо пользователю Елена Гахова
Я тебя спросить хотел, как ты относишься к тому, что бутстрап полностью пересирает разметку html ? Везде и всюду пишут, что html нужен для семантической разметки и месиво из дивов и классов этому точно не способствует Как ты вообще относишься к этому ? Проблема ли это или просто каждому свой инструмент ? И как часто сам используешь bootstrap ?
@BrainsCloud
5 жыл бұрын
Для каждого инструмента есть свое применение. Бутстрап использую - сетку, и иногда некоторые js компоненты, в зависимости от проекта.
@pilyugin
5 жыл бұрын
@@BrainsCloud кажется, дивы не влияют на семантику... поисковики же ищут семантические теги и им должно быть по барабану на эти рабочие моменты разметки... они все равно найдут титл, нав и другие теги... или я ошибаюсь?)
@user-kj4db2mz2s
5 жыл бұрын
@@BrainsCloud Понял, спасибо за ответ
@user-wm4xh4ho2t
5 жыл бұрын
@@user-kj4db2mz2s можно неплохо совмещать семантические теги с бутстрап классами
Блин, у меня одного ломается миксин на моменте с зеленой кнопкой? Не понимаю, почему он не хочет красить ее в зеленый. Вроде все так же как на видео сделал.
Давай урок по sass. Год уже прошёл
Хочу уроки php)
Сделай плиз по sass
3 раз смотрю память не очень 👍👍😂😂😂
Я так понял, этот препроцессор предназначен для оптимизации кода.
От вас бы ещё видео про pug..
@BrainsCloud
4 жыл бұрын
Такого точно не будет
Пригодится
Какой ты быстрый..как по.....как река..как река быстрый)))
brackets очень классный был... но он не развивается. постепенно ушел с него.
Дмитрий. А какая версия Браскетс у вас стоит. Мой Браскетс в упор не видит этот плагин.
@BrainsCloud
4 жыл бұрын
Сергей Кондулуков последняя
@user-qh5fr3yo1w
4 жыл бұрын
Дмитрий, может быть дадите ссылку. Я тоже скачал последнюю версию с официального сайта, но этого расширения Бракетс не видит.
@BrainsCloud
4 жыл бұрын
@@user-qh5fr3yo1w brackets.io/
на 27 минуте LESS перестал работать
Ты просто крут 993 лайка к 0))
Для себя не увидел плюсов относительно просто использования CSS. Только усложняет нормальное использование CSS, нежели чем дает что-то существенно весомое, что перевешивает: время изучение этих препроцессоров, написание доп. код обертки для CSS. Препроцессоры - это попытка из CSS сделать некий суррогата ЯП, что уже сделали конструкторы сайтов в гораздо лучшем виде и на более высоком уровне.
@KuKu_RuKu88
4 жыл бұрын
Если честно, я тоже не увидел ничего что ускорило бы мою работу !!! Весь смысл, если я правильно понял, быстро поменять некоторые блоки, если нужно !!! Лично по мне, можно и переписать блоки самому и без less !!! Но вот если большой сайт, еще и чужой, да с лессом, тогда финиш - не разберешься !!!
5:42 казалось бы, причем тут Украина?
Еще один язык программирование
таймкоди не помешали би
Дмитрий спасибо за уроки! Всегда слежу за вашим каналом. Но лично мое мнение на счет препроцессора - никакой экономии в этом нет. На создание переменных, мексин, и подключении всего этого уходит как минимум столько же времени ( а может даже и больше ), чем если б я лишний раз повторился в обычном CSS. При создании URL для картинок это вообще в два раза дольше прописывать чем в обычном режиме. Ну сколько, в среднем, повторятся кнопки или цвета на среднестатистической сайте - 5, 10, ну пусть 20 раз. Так Вам же не приходится их заново писать, просто копируем, если нужно немного корректируем. Короче говоря приходится это учить только из-за того что на студиях этим пользуются.
@kvaqich
4 жыл бұрын
Ну пусть ты 20 раз скопировал кнопку. А когда захочешь менять, то будешь 20 раз менять каждую и так во всём. А объём кода значительно увеличится, так как ты одну и ту уж сущность 20 раз написал.
Как блокбастер посмотрел...
Кликбейт, видео длится 48 минут
Спасибо!
Спасибо
Спасибо