SVG, большой гайд
ฝัง
- เผยแพร่เมื่อ 29 ก.ย. 2024
- Друзья, записал для вас гайд по svg. Вам обязательно нужна будет эта база для дальнейшего развития в svg анимации. Как говорится, сложный макет - это простой макет, в котором много сложных мелких деталей, часто эти детали можно решить, если вы имеете хорошую базу по svg.
clip в css - bennettfeely.c...
svg-path - yoksel.github....
размеры в svg - yoksel.github....
машинка - codepen.io/yok...
SVG или иконочный шрифт:
• SVG или иконочный шриф...
Телеграм канал:
t.me/from0to1com
Сайт курса по верстке - from0to1.com.ua/
Подпишитесь на канал, если вам понравилось данное видео:
bit.ly/2IFzwBZ
8:22 Рисование прямоугольника.
13:34 Рисование круга.
15:20 Рисование овала.
17:08 Рисование многоугольника.
21:55 Рисование линии.
23:26 Рисование ломаной линии.
28:08 Рисование кривой, Figma.
Сапожник будет доволен - сапожник в восторге! ;)))
Как всегда, улёт и супер!
просто ох@@@ваю насколько полезный канал
спасибо, ну у меня много видосов которые прокачают
Привет! Рад что ты снова с нами! Можешь пожалуйста сделать видео по оптимизации сайта, для pagespeed? )
окей)
Спасибо огромное! Даже в невероятных условиях войны, ты продолжаешь вкладывать силу и энергию в обучение.
Нет слов. Дякую
спасибо
Брат как у вас там в Украине? Я из Кыргызстана. Как вы там? насколько тяжело стала жить после войны?
просто Россия воюет не так как Израиль
@@sshcvc откуда ты выползло ? залазь обратно
@@ligat-rome жил в Николаеве , взорвало соседний дом снарядом
переехал в Одессу , а тут шахеды летают по ночам постоянно + вижу как их сбивают ( я у моря живу и тут очень хорошая видимость всего этого )
Инфы канешн не дуже насыщено, но лайкос впаял чуваку чисто за базар!!! Ни в коем случае не переходи на "нормальную" речь))) Бакланишь шедеврально!!!
З.Ы. Сделай, еслли шаришь видос про зум, очень мало инфы про ЭТО
Вадим хотел нарисовать 卍 , когда показывал polyline
Молодчина ти, Вадим!!! Класно все розповідаєш і видно, що розумний ти хлопець!!!
Ждем такой же курс по Canvas!
Вадим не могу открыть макет из предыдущего ролика на Фигме, так как случилось так что я живу в рф, его можно в Фотошопе открыть? Сам пробовал не получилось!
макеты из фигмы в фотошопе не открыть
Ще таке питання, контент українською мовою буде?
Не смог не написать ваша подача лучшая, самая лучшая правда
@@ricardo_milos1977 спасибо
спасибо, полезно! жду в дальнейшем видосы с более сложными примерами анимации из реальных проектов)
отлично
Вот это подгон,спасибо. Ещё очень хотелось бы увидеть видео про обновлённую сборку GULP
в плана есть обновление сборки
Тогда с нетерпением ждём)
@@РоманЛебедев-о3э зачем в 2022 году нужен галп?
@@Евгений-х4л2щ а почему в 22 году галп не нужен?
@@РоманЛебедев-о3э я не говорил что он не нужен. Я просто спросил почему он ещё используется, чем он лучше чем Парсел или Вит
крутое и понятное видео, спасибо большое!
очень надеюсь на разборы разных сложных анимаций и всяких идей, раз уж вы с анимацией работали)
Нарисовал SVG рамку во весь экран. Уменьшаю экран браузера, а рамка обновляется/уменьшается только после того как нажму обновление страницы. Почему?
SVG-блокбастер, не иначе! спасибо, Вадим, все по полочкам, реально много любопытного для меня! добавила филл на svg палец под видео. вот бы еще видос с версткой макета и более-менее сложной svg-анимацией по мотивам твоих реальных проектов ))
Спасибо Вадим. Здоровья и Мирного неба Вам и вашей семье.
Иду с работы,смотрю в телефоне.Неудобно,надо быстрей домой к ноутбуку.
Кажется я уже почти знаю как мне нарисовать одну заковыристую кнопку
круто
пару раз видел на сайтах в зависимости от скролла плавали буквы по кривой линии. это через svg делается?
В целом хорошее видео. Но не сказано ни слова об анимации в непосредственном коде svg без css. И тишина относительно градиентной заливки. Всё остальное отлично.
Блин а я тупо не могу найти как прописать в html скачанный свг при нажатии на который я переходил бы по ссылке. Ни типа навигационная панель домой, поиск, контакты и ТД.
Какую тему в vscode ты используешь?
На главных страницах некоторых больших интернет магазинов всякие пнг и жпг хотя там место свг. Аш глазам больно
Я кажется влюбляюсь в Вашу работу! Сердечное спасибо 💛
Что там нажимаешь в Figme? Область мне нужно отдельно область чтобы менялась нихатыж а надобно шас
Спасибо.
Спасибо,как всегда на высоте,много информации и позитива.Какой мак юзаешь.Для задач верстальщика,фронтендера удобно использовать?,или есть ньюансы
Вадим, как тебе идея записать видос про полную работу на фрилансе. От поиску заказа до сдачи. Очень полезно будет для новичков
заказчику это не понравится, он не хочет чтобы все знали стоимость заказа, как я с ним общался, и видели как я создавал сайт, а без пруфов и цифр это не интересно
ну svg похож на canvas но в canvas можно не только вектор рисовать но и растр
Привет, жду стрим по продвинутой верстке)
Ай молодец! Спасибо за труд.
Вадим, в телеграме бываете? ))
Что за шрифт у тебя в VS Code?
Крутой гайд, спасибо
еще drag and drop итересно
Оце я розумію крутий урок👍💪💪.Було би круто якби ти зробив уроки по JS, jQuery і по WP:)))
Урраааа!
Спасибо за ТОП контент 🥳
Спасибо большое! Было приятно смотреть!
Спасибо за все
Очень круто объяснено. Спасибо. Хорошо что зашел на эту вечеринку
Меня так разрывало, когда он говорил "вечеринка"🥳🥳🥳 приятный чел
На тебе лайк
Спасибо, мне кажется видео приобрели более высокий уровень
спасибо
Спасибо
Если svg содержит id внутри себя, то если эта svg используется несколько раз на странице, html-валидатор будет ругаться, что несколько одинаковых id на странице
Лучший)
svg из Font Awesom можно качать и вставлять в свой сайт без лицензии?
Опять я провафлил транслейшн((
p.s. Сегодня еще и футбол. Не проспать бы
для меня inkskape удобнее для работы с SVG , чем figma
Прекрасный материал, большое спасибо!
Но остался один вопрос..мне все таки неясно зачем было заходить в фигму и менять размеры яблока, а потом ещё делать изменения в тегах в программе... Нельзя ли просто было изменить параметр wight в стилях css?
у меня новая версия ютуба и ночная тема у меня кнопка подписатса серая
аааа, паника паника=)
какая тема для иконок vscode
стоит, скажите пожалуйста?)
Спасибо за такое информативное видео! Шрифт супер как называеться?
Вадим такой вопрос. Эти сайты, что мы делаем на марафонах можно вставлять в резюме?
Что за напиток пьешь????Все имеет значение))))
кипяченую, воду надо кипятить, а то кто знает что в ней плавает
Як вам бредова ідея створити дизайн сайту на svg, самі ж кажете, навіщо обмежуватися базой
Насчёт тега clipPath, думаю, что в таком случае лучше использовать css свойство mask-image, оно попроще будет, а результат тот же
видос ваще топовый!!! пасиб
пойду ещё раз пересмотрю про маски
Просто огромное человеческое спасибо!
Максимально доступно и информативно 🤘😎
Величезне Вам дякую! Дуже корисне відео!)
Вообще богато! Появилось понимание как работать с svg. Благодарочка!
спасибо....думала сложно, по другим видео, но вроде все не сложна))
Аааааа, ура, то что надо, обязательно посмотрю. Лайк!
спасибо! очень полезный ролик!))) толково всё! многое стало на свои места!)))
А про теги pattern, defs, use и т.д. хотелось бы услышать)
Спасибо!
Будьте здоровыми!
на одном дыхании смотрится! будь здоров!!!
Шикарно!!!! Просто и доступно все разъяснил. Спасибо большое!!! Мир вам!!
дай бог тебе место в вальхале
Самый приятный контент в этой сфере.
Отличное видео!
Хотелось бы увидеть как делать выпадающее меню
Ну это царский ролик вышел
"По центру пацанёныша" 🤣 Можно смотреть видосы просто ради этих фраз
Спасибо
Супер.... Дякую за пояснення.
Хорошие у вас уроки. Делайте шрифт крупнее, на экране с высоким разрешением приходится напрягать глаза
буду стараться, спасибо
Мега круто! Спасибо !
Крутой видос. Ждём более сложные анимации с применением js. Маски возможно необычные покажешь для изображений. Спасибо!
спасибо за видео
Спасибо большое
Нереально крутой гайд! Низкий поклон и жирный лайк.
благодарю
Шо такое SVG?
Спасибо, очень полезно
I'm first 🤠
красава
полноценно и быстро. было приятно смотреть
Огромное спасибо за отличный урок и практику!
Спасибо Вадос за твои труды!😁 Ты всегда будешь у нас в авторитете!😏😁
"Ламаная" линия- линия которую поломали ))))))👍
23.38 топчик))
Круто!
Не вероятно крутой преподаватель!!!!!!!
спасибо
Красава
Дякую!
Дякую !
дякую
Урааа, спасибо
Дякую за відео. Єдине прохання на майбутні відоси: якщо матимете також цікаві англомовні статті по темі - кидайте, будь ласка, лінк і на них, бо дуже не хочеться послуговуватися росконтеном.
Спасибо, будем изучать!
супер
Всем привет! У меня вопрос немного не по теме видео.
Стоит ли совмещать изучение английского языка и HTML, CSS, JS или лучше сначала учить фронт, а потом уже начинать английский, чтобы не разрываться?
П.С. Вадос, ты крут!
Лучше сперва англ учи. Потом хтмл и цсс и в конце отдельно джс иначе взрыв мозга будет
@@gio2156 Ну я буду сначала CSS и HTML. Я это к тому, стоит ли с английским совмещать. Просто считаю, что основное это все же верстка, а язык уже потом можно. Много где слышал, что в принципе норм подход.
я думаю что совмещать будет крайне сложно
@@vadymprokopchuk ну это да. Тем более, на сколько я помню, ты сам недавно начинал учить английский и тебе особо он не был нужен.
Еще, как вариант, английский по плейлистам слушать.
Ты лучший
спасибо)
Супер! Дякую.
дякую