Тёмный

HTML верстка слайдера на чистом CSS 

WebDesign Master
Подписаться 303 тыс.
Просмотров 25 тыс.
50% 1

Все курсы в одном комплекте: wd-m.ru/bundle
Создание сайта от А до Я: goo.gl/ankxq9
Всем привет, друзья! Сегодня мы создадим слайдер галерею на чистом CSS (без JS), рассмотрим работу с изображениями, затронем подготовку изображений для Retina-дисплеев (экранов с масштабированием интерфейса от 150% и выше) посредством HTML 5 и я расскажу о других интересных и полезных вещах.
Материалы урока, результат и референсы: webdesign-master.ru/blog/html...
ВКонтакте: jediweb
Телеграм: t.me/jediweb
Дзен: dzen.ru/jediweb

Опубликовано:

 

7 май 2019

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 64   
@wdm
@wdm Месяц назад
💥 Все курсы в одном комплекте 👇👇👇 webdesign-master.ru/bundle_courses
@bpv82
@bpv82 5 лет назад
Как же приятно смотреть твои уроки!)
@aleksandrkokin6065
@aleksandrkokin6065 5 лет назад
Долгожданный новый урок, спасибо Алексей!
@QuPro
@QuPro 5 лет назад
Спасибо за урок и за стартовый проект. Постоянно им пользуюсь!
@ZhuzikBer
@ZhuzikBer 5 лет назад
Как же вовремя этот урок, благодарю! 👍
@HarderStylesInc
@HarderStylesInc 5 лет назад
Очень приятная подача материала. Смотрел на одном дыхании. Спасибо! Ждемс уроков еще.
@MrSlavjon
@MrSlavjon 5 лет назад
Алексей - годнота шикарнейшая ;) Лучи добра тебе!
@user-alada-kedaura
@user-alada-kedaura 5 лет назад
Алексей, Вы просто бомба, очень ждал, пока ждал уже сам подтянул сильно знания, но все равно смотрю с удовольствием) За шаблон отдельное спасибо!
@user-yq2fs9pn3t
@user-yq2fs9pn3t 5 лет назад
Отличный урок! Ждём урока по работе с изображениями.
@user-ht8sj1my9q
@user-ht8sj1my9q 5 лет назад
Спасибо за урок!!!! Ждём урока по работе с изображениями.)))
@kro0sh843
@kro0sh843 5 лет назад
Спасибо за урок! Если кто-то столкнулся с проблемой: Error in plugin "gulp-gm" и блаблабла, то (не знаю можно ли тут размещать ссылки, но рискну) www.graphicsmagick.org/ выкачиваете отсюда ручками программу и устанавливаете. Галку с "PATCH" не снимать. Т.к. винду все равно сносить, то не стал заморачиваться с установкой Ubuntu и пытался сделать через стандартную командную строку.
@wdm
@wdm 5 лет назад
Это не спам, почему бы и нет :-)
@CaH9Iable
@CaH9Iable 5 лет назад
+ нужно перезагрузить компьютер, если ошибка не устранена
@user-ii5bo3nm6o
@user-ii5bo3nm6o 5 лет назад
Спасибо большое!
@user-hz4le9oq5b
@user-hz4le9oq5b 4 года назад
Спасибо, была такая проблема. Совет помог!!!
@mahamiha6332
@mahamiha6332 5 лет назад
Спасибо. Классный видос. Приятно, что есть 1440p
@user-mt9gm3ez8c
@user-mt9gm3ez8c 5 лет назад
Спасибо за урок, отличный плагин для изображений! border-radius - brs теперь в emmet
@user-ip7ox6vh1q
@user-ip7ox6vh1q 5 лет назад
спасибо за урок! ждем джедай#8
@andrzeyshliaha5302
@andrzeyshliaha5302 5 лет назад
Очень жду респонсив по картинкам, очень этого не хватало в прошлой версии HTML Optimazed 4
@d9m0n21
@d9m0n21 5 лет назад
ОООО Огооонь!! Очень рад новым видео Алексей!! =)
@lidawool3151
@lidawool3151 5 лет назад
оо, видео очень даже кстати! спасибо!
@demx9050
@demx9050 5 лет назад
Час пролетело как 5 минут))Спасибо за урок!
@qip7402
@qip7402 5 лет назад
Отлично и просто великолепно!
@MrAmir991
@MrAmir991 5 лет назад
Спасибо, за ваши видео)
@sdsaasdasd4683
@sdsaasdasd4683 5 лет назад
Ждем новый джедай с нетерпением!
@wdm
@wdm 5 месяцев назад
Здравствуйте. Новый Джедай верстки уже на канале: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-3PzzZ5eHHig.html
@uliev9298
@uliev9298 3 года назад
На мобильных можно показывать фотоконтент как аккордион. Урок классный.
@exploringtheworld8780
@exploringtheworld8780 2 года назад
Спасибо за урок!!!!
@user-xt5sm6yj6f
@user-xt5sm6yj6f 5 лет назад
Спасибо)
@alexeska739
@alexeska739 5 лет назад
Спасибо.
@thenexgames2368
@thenexgames2368 5 лет назад
Я ваши уроки жду прям как Мстителей 4 ждал)) Спасибо вам большое
@romanzavoruiev
@romanzavoruiev 5 лет назад
Алексей, всё супер!) Будет SCSS для OptimizedHTML5 ?
@user-nl1ds2th1g
@user-nl1ds2th1g 5 лет назад
Спасибо, Ждем Джедаев..
@wdm
@wdm 5 месяцев назад
Здравствуйте. Новый Джедай верстки уже на канале: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-3PzzZ5eHHig.html
@user-ne8mx8mt9q
@user-ne8mx8mt9q 5 лет назад
Серьёзно? Вы из-за зрителей говорите "пикселей"!? Дорогого стоит. Святой человек прям :D
@27cobalt60
@27cobalt60 5 лет назад
Опа на VS Code таки перешел
@tovjukov
@tovjukov 5 лет назад
Урок по докеру, не планируете? Для комплекта сервер+пхп+база+modx. И есть такой модуль как gitify, что про него думаете, очень интересно ваше мнение. И еще раз спасибо за ваш труд.
@denissolovyev4283
@denissolovyev4283 5 лет назад
Вы используете при вёрстке методологию БЭМ?
@game_m
@game_m 5 лет назад
responsive image - очень интересует, ждем с нетерпением, так же хотелось бы узнать ваше мнение о использование webp на сайте, на сколько это полезно и важно.
@AlanSeerage
@AlanSeerage 4 года назад
Алексей, может быть уже где-то это обсуждалось, но что вы думаете про БЭМ?
@xray9114
@xray9114 5 лет назад
Для тех кто забыл свой пароль в подсистеме Ubuntu: Запустите bash и запишите свое имя пользователя Linux (не соответствует вашему имени пользователя Windows). В командной строке администратора Windows (правой кнопкой по кнопке Windows, открыть PowerShell от имени администратора ) измените пользователя по умолчанию на root: ubuntu config --default-user root Теперь Bash на Ubuntu в Windows регистрирует вас как root без запроса пароля Используйте команду passwd в Bash, чтобы изменить пароль пользователя (пользователь, пароль которого вы хотите сбросить): passwd (имя пользователя Linux) Введите новый пароль. Не забудьте изменить пользователя по умолчанию на обычного пользователя в командной строке Windows ubuntu config --default-user (имя пользователя Linux)
@wdm
@wdm 5 лет назад
Добавил инструкцию по установке GraphicsMagick на странице урока. webdesign-master.ru/blog/html-css/css-gallery.html
@valdog2593
@valdog2593 5 лет назад
Спасибо!
@user-bd3lo4ry4c
@user-bd3lo4ry4c 5 лет назад
Алексей, здравствуйте. Может вопрос не по теме. На сколько я понимаю вы предпочитаете cms modx для большинства задач. А могли сказать почему? Спасибо заранее за ответ.)
@wdm
@wdm 5 лет назад
Я использую MODX только для клиентских проектов. Это быстро, гибко и удобно. Все мои личные проекты работают на Jekyll, в том числе и сайт webdesign-master.ru
@VLADRYZHOV
@VLADRYZHOV 5 лет назад
Спасибо, Алексей! когда "Джедай верстки"? готов купить))
@tovjukov
@tovjukov 5 лет назад
Звук стал круче, новый микрофон?
@wdm
@wdm 5 лет назад
Микр тот-же. Новое оборудование. Эквалайзер, преамп, компрессор. Куча всего.
@tovjukov
@tovjukov 5 лет назад
@@wdm шикарно, звучит бархатно
@kinch358
@kinch358 5 лет назад
Алексей, заинтересовала тема оптимизации процессов при помощи Gulp. Буду рад, если сделаете обзор или уроки в этом направлении. Спасибо.
@user-tp4id1hp3u
@user-tp4id1hp3u 5 лет назад
на канале есть
@SpektRProduction
@SpektRProduction 5 лет назад
С возвращением и спасибо за видео) Скачал стартовый шаблон и столкнулся с такой проблемой ibb.co/6gQ1XhV
@wdm
@wdm 5 лет назад
sudo apt update; sudo apt install graphicsmagick
@SpektRProduction
@SpektRProduction 5 лет назад
@@wdm спасибо,попробую)
@user-kj8mf3be9c
@user-kj8mf3be9c 4 года назад
а как pug подключить? в gulp
@serg454
@serg454 5 лет назад
Пробовал подключить pu., всё компилилось, но почему-то browser-sync не обновлял страницу. И не смог установить ubuntu на LTSC винде
@wdm
@wdm 5 лет назад
Здравствуйте. Почему не можете?
@andrzeyshliaha5302
@andrzeyshliaha5302 5 лет назад
Не получается на Мак ОС sudo apt update; sudo apt install graphicsmagick --- хотя установил, но при выполнения галпа ошибка на таске img, подскажи плиз
@wdm
@wdm 5 лет назад
Для. Мака есть brew: brew.sh
@wdm
@wdm 5 лет назад
brew install graphicsmagick
@andrzeyshliaha5302
@andrzeyshliaha5302 5 лет назад
@@wdm перешел по ссылке, вставил строку, потом ввел brew install graphicsmagick, по итогу он мне пишет Error: No formulae found in taps. Error: No available formula with the name "graphicsmagick" Error: No previously deleted formula found. И опять же, почему то не уходит та ошибка когда провел все нужные процедуры, вот думаю с чем это может быть связанно
@andrzeyshliaha5302
@andrzeyshliaha5302 5 лет назад
@@wdm Проблему решил, скопиовав строку brew install graphicsmagick с другого источника, бред скажете вы Алексей, но сработало, спасибо за ответы )
@spookee3183
@spookee3183 4 года назад
Что за браузер?
@wdm
@wdm Год назад
Chrome
Далее
Оптимизация сайта от А до Я
18:03