По промокоду «YouMeow» скидка 900 рублей на интенсив или программу профессии в Академии - tml.io/mbf87

Лайк за "спросите у родителей" и футболку. С материалом тоже всё чётко.

@mexvision-3556

5 жыл бұрын

Ахаха, класс! Шутка топ)

Ну и как всегда, Вадим на высоте) безумно нравится ваша подача, открыла для себя, что SVG не так прост)) "нужно больше шортиков":) Спасибо)

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

Посмотрела все уроки! Хочу еще! Спасибо, Вадим! :)

Спасибо большое помогли))) от души братуха душевно в душу)))

Спасибо Вадим! Уважаю людей, которые ценят своих подписчиков и их время. Не то, что лофт-блоги всякие

Вах, как классно! Спасибо!

Очень полезно и интересно! Большое спасибо!

Ребят, у вас лучшие интерактивные курсы и самые информативный канал. Вадиму Макееву отдельный респект. С удовольствием и обязательно пойду на интесивы. продолжайте в том же духе, спасибо!)))

Суперпонятно! Наконец-то прояснилось.

лаконично! спасибо)

спасибо за шорты. качественно, лаконично и информативно, в отличие от большинства подобного контента. хотелось бы увидеть выпуски об анимации на css, основные приемы, ошибки, бэстпрактис.

@HTMLAcademyTV

7 жыл бұрын

Спасибо, постараемся

Обожаю Вадима) как разработчика!

Вот это подача! Загуглил, открыл сайт, посмотрел, открыл Ютуб поставил +++ и подписался!

ОЧЕНЬ ПОМОГ

_Понятно . Спасибо ..._

Круто !

все четко и по делу! Молодцы. Минус вижу только один, вставляйте всегда 5 копеек про кросбраузерность

ведущий - просто душка, лайк ему!

Спасибо, Вадим. расскажи пожалуйста о гридах(grid) и, если не трудно сравни флексбоксами.

@HTMLAcademyTV

7 жыл бұрын

Спасибо за вопрос

@user-qg5fi2eq6k

6 жыл бұрын

Спасибо за ответ =)

Интересный канал . Вопрос - разница между bower,npm,yarn

Через (include php) можно страницу с svg файлом вставить.

Вадим, расскажите, пожалуйста, про несколько header/footer на странице.

@HTMLAcademyTV

7 жыл бұрын

Спасибо за вопрос

Статья Сары не доступна. Нашел крутые иконки и не пойму, какой способ вставки выбрать. Если как в лекциях на интенсиве, то много мусора в коде. Склоняюсь добавить их с помощью . Был бы рад услышать мнение профессионалов.

Хорошо, но редко. Давайте новые ролики от Вадима Макеева каждый день!)

@HTMLAcademyTV

7 жыл бұрын

Вадим пока не так хорошо масштабируется, как SVG 😄

Статьи Сары Суайдан - Page Not found Про svg-спрайты хорошо бы осветить еще. А то в подкастах много раз упоминали, что для иконок давно надо переходить от шрифтов к svg, но как-то это пока криво сделано. Чтоб раскрашивать иконку нужным цветом в шрифтах достаточно задать color в css, а в svg приходится вставлять внутренности svg в код страницы (из-за "за стеклом").

@AlexP-qm7ew

6 жыл бұрын

www.sarasoueidan.com/workshops/svg-coffee-cup/ тут есть

SVG и Canvas - Что учить?

Не знал про object опцию. Спасибо!

А если вставить с помощь img и не задать размер, картинка не расползется на всю ширину?

А есть какие-то особенности применения svg при верстке электронных писем? И было бы оччень интересно послушать в общем об особенностях и best practises верстки электронных писем. Заранее спасибо :)

@HTMLAcademyTV

7 жыл бұрын

Спасибо за вопрос!

Здравствуйте!, почему если использовать

@azinho7318

2 жыл бұрын

алалалалалал

Такой вопрос, а есть "обходной" способ добавлять ховер эффекты для свг графики вставленной через тег img или фоном? Скажем иконки соцсетей при ховере чтобы меняли свой цвет с плавностью.

@HTMLAcademyTV

7 жыл бұрын

Спасибо за вопрос

может заодно подскажете где я не так делаю и что. пытаюсь заменить логотип на .SVG при помощи data:image/svg+xml;base64, . Генерирую код в онлайн генераторе и вставляю после последней запятой. вставляю в код

Как получить доступ javascript в внешний svg через () ?????

А в чём разница между embed object?

Что такое After и before?

кратко, информативно, без лишней воды. С удовольствием посмотрел бы видеокурс по html, css и в целом по верстке в вашем исполнении. Нет ничего подобного ?

@prodoter97

7 жыл бұрын

Интенсива более чем хватает :)

@HTMLAcademyTV

7 жыл бұрын

Вадим ведёт лекции на интенсиве «Базовый HTML и CSS», вместе с другими преподавателями курса - htmlacademy.ru/intensive/htmlcss, также вы можете поискать видео с его выступлений на конференциях.

Расскажите про свойство display: run-in. Пишут что, есть такое, но рабочее оно или уже нет?

@HTMLAcademyTV

7 жыл бұрын

Спасибо за вопрос!

а можно ли вставить как object, img, frame и также менять цвет при наведении? Или же только если все содержимое SVG вставлять в html ?

@jerrymatis8807

Жыл бұрын

Можно попробовать через псевдокласс hover

А рассказать о use?

@HTMLAcademyTV

7 жыл бұрын

Можете немного уточнить свой вопрос?

@TheRichNuke

7 жыл бұрын

Имел ввиду добавление SVG используя

Здравствуйте, можете помочь, я создаю картинки в корэле и когда экспортирую в SVG, то они сохраняются как свг формат, но имеет путь html, вот как мне их экспортировать, чтобы это был обычный свг, который открывается в соответствующих программах без браузера, помогите, пожалуйста

я все это читал на сайте минут 10 назад

Вадим Макеев Красава!!!

Привет, мне с сервера приходит ссылка uri \\ -- это svg со своими ивентами и скриптами. подскажите пожалуйста, почему на тег embed не действует онклик ?

Как можно обойти у select отсутствие фона у элементов которые раскрываются? спасибо за ответ)

@HTMLAcademyTV

7 жыл бұрын

Попробуем рассказать в одном из выпусков

Футболка правка крутая =)

сделал мой день... Спросите у родителей)))

Что с поддержкой flexbox, и можно ли полностью перейти на него в реальных проектах?

@user-qh5dw1lq7w

7 жыл бұрын

Николай Астраханцев caniuse.com/#feat=flexbox

@user-bg1gd4fe1b

7 жыл бұрын

Ещё в IE10 криво работает flex-basis в %

@HTMLAcademyTV

7 жыл бұрын

Спасибо за вопрос

@user-vf1zo4kn1s

7 жыл бұрын

Можно, проверено на не одном проекте.

@kids-man

7 жыл бұрын

Николай Астраханцев давно пора)

Все таки уже "Шоу" ))

SVG is good for logos only or something else? Please, tell more about flex. Very interesting thing. By the way, T-shirt is really cool, I want to buy one)).

@HTMLAcademyTV

7 жыл бұрын

👍

@meeba-dev

7 жыл бұрын

HTML Academy рад, что хоть где то не игнорят, если пишешь на английском. Так все таки только только для логотипов и других сложных изображений, которые сделали вручную, а не сфотографировали?

@HTMLAcademyTV

7 жыл бұрын

SVG подходит всех для изображений, которые нужно масштабировать без потерь в качестве - kzread.info/dash/bejne/d6l408qvgNC3e6w.html видео по теме, под ним в описании есть ссылки на материалы, например про форматы и их применение - htmlacademy.ru/blog/113-image-formats

@meeba-dev

7 жыл бұрын

Отличный блог, все понял. Благодарю))).

А я подумал про вставку из JS и про то как надо через createElementNS создавать DOM SVG.

Все это хорошо, но при извлечении SVG иконки, в редакторе сплошной набор букв, и никак нельзя как то взаимодействовать через стили... Как быть?

Статьи Сары Суайдан - Page Not found

Доброго времени суток. Подскажите пожалуйста кто нибудь верный способ заставить SVG логотипу подчиниться z-index - у. Спасибо

@HTMLAcademyTV

3 жыл бұрын

Добрый день! Уточните, пожалуйста, что именно вы имеете ввиду? Фигуры внутри одного SVG нужно контролировать не с помощью z-index, а посредством порядка отрисовки (порядок в коде).

А как же Sarah Drasner? Она и книги пишет про svg, издает O'Reilly.

Через css как контент не все браузеры читают

пора уже телеканал открывать и целыми днями транслировать всё из мира IT, ну или разбивку сделать - по одним дням фронтэнд, по другим бэкэнд, по третьим конкретный язык или технология, потом новости, думаю канал будет популярен)

@user-gd6il5zb8l

6 жыл бұрын

>думаю канал будет популярен Не то слово)

Майк Вазовский :)

О круто, Вадим теперь в HTML Academy?

@HTMLAcademyTV

7 жыл бұрын

Всё так - htmlacademy.ru/blog/159-vadim-makeev

А почему "всегда начинайте с самых простых"? В чём причина? Про svg use так и не сказано(

@pepelsbey

7 жыл бұрын

Начинать с самых простых нужно потому, что они самые удобные и эффективные. Фон для псевдоэлемента проще, чем целая иконка прямо в HTML или сложная система спрайтов. И если ей не нужно менять заливку при наведении - зачем наворачивать? А если нужно (то есть не хватает) - тогда другой вопрос. Про юзы и символы, как обещал, ещё поговорим.

Putting video speed on 0.75 to follow xD

Ссылка внизу на стат'и Сары ведёт на 404

Большой вопрос у меня к Вадиму или к тому, кто знает, особенно про семантику разметки иконок в документе. Посмотрел видео, всё круто, всё просто, но на практике, ты собираешь в спрайт, чтобы использовать через use, тебе нужно прописывать обязательно width и auto для svg, чтобы картинка не отображалась/увеличивалась на весь экран. Но когда ты идёшь в CSS, чтобы стилизовать, то размер не изменишь из CSS. Задача: для мобильной версии изменить размер иконки с 70px до 30px. Она будет обрезаться, и не будет увеличиваться. Проблема решается через viewBox, не задавая при этом width and height SVG элементу в html, когда инлайнишь из спрайта через use. Тогда размеры в CSS контролируются. Ок, у меня два вопроса, даже три: Первый: говорят нужно задавать width и height svg, как на самом деле быть, если учитывать проблему, которую я описал выше? Контролировать ширину и высоту через CSS можно? Или как в такой ситуации делать? Второй: правильно ли, исходя из семантики, иконки вставлять/прописывать в HTML, а не через фон в CSS (они за стеклом - никак не поуправлять ими). Инлайн svg вне спрайта (use) - не кешируется, правильно ли собирать svg изображения (лого, что-то там ещё) и иконки в спрайт, инлайнить всё через use, задавать viewBox (чтобы управлять размером), через CSS задавать размеры и менять им цвет. Третий: как это, вообще спрайт, отображать правильно в структуре файлов по БЭМ, каждому блоку своя разметка, стиль, скрипт, “картинка”. Если “картинка” для определённого блока, элемента лежит в спрайте (в отдельном - в общем документе), как правильно делать? Или каждому блоку - нужно отдельно иконку/картинку SVG (без спрайтов), но тогда не будет кэшироваться.

@aprinciple9559

5 жыл бұрын

@Norton Studio ок, каким образом мне использовать картинку-иконку, которая должна меняться через css? Я могу инлайново ставить svg в HTML, менять через css, но так svg не кэшируется, кэшируется, когда используешь спрайт, а в html вставляешь svg через use

FRONT-END DEVELOPER / AUTHOR / SPEAKER Oops! This is clearly not the page you’re looking for.

Здравствуйте, было бы интересно послушать про CSS Custom Properties, для чего они, как работают и как правильно их применять. За шоу большое спасибо, рассказываете лаконично и понятно (:

@HTMLAcademyTV

7 жыл бұрын

Спасибо за вопрос!

Ещё тут есть немножко статей css.yoksel.ru/tags/#svg : )

@HTMLAcademyTV

7 жыл бұрын

😇

@HTMLAcademyTV

7 жыл бұрын

Спасибо за вопрос, рассмотрим в будущих выпусках.

SVG это кртуо.

А как же «embed»?! Это вроде бы фрейм нового поколения, который работает во всех современных браузерах

Дааааа... пожалуй... чем больше углубляешься в предмет, тем больше понимаешь что ничего не знаешь...

sarasoueidan.com/tags/svg/ Ошибка 404

@HTMLAcademyTV

6 жыл бұрын

Сара переделывает сейчас свой сайт, к сожалению, поэтому доступа нет.

почему шорты а не например не майка?

@Arctikus

7 жыл бұрын

Почему Space, а не космос?

@HTMLAcademyTV

7 жыл бұрын

Short - с английского «короткий», «майка» - T-Shirt‎

Подредактируйте ссылочку Сары Суайдан => 404

Так а какие браузеры ну умеют в svg? Мама не рубит

я: как через object вставить флеш ролик? мама: че? ты меня обманул

Я понял что я стар когда он сказал спросить у родителей про вставку swf в html :)

Манера речи напоминает путина, аж не посебе стало в момент просмотра ахахах во прикол :) лайк

lfey

Все отлично. Но музыка почему-то не нравится. Как будто в торговом центре зомбимузыка.

@HTMLAcademyTV

7 жыл бұрын

😞