Кастомные свойства - HTML Шорты
- Why variables in CSS are harmful, Берт Бос - www.w3.org/People/Bos/CSS-var...
- Пользовательские свойства CSS. Основы - zmeika.name/2017/03/02/custom-...
- It’s Time To Start Using CSS Custom Properties, Сергей Господарец - www.smashingmagazine.com/2017...
- Гибкая настройка внешнего вида выдачи Яндекса, Руслан Муфтиев - events.yandex.ru/lib/talks/4265/
Ближайшие интенсивы:
- «HTML и CSS, уровень 1» - htmlacademy.ru/intensive/htmlcss
- «HTML и CSS, уровень 2» - htmlacademy.ru/intensive/adap...
- «JavaScript, уровень 1» - htmlacademy.ru/intensive/java...
- «JavaScript, уровень 2» - htmlacademy.ru/intensive/ecma...
- «JavaScript, уровень 3» - htmlacademy.ru/intensive/react
- профессия «Фронтенд разработчик» - htmlacademy.ru/profession/fro...
- профессия «React-разработчик» - htmlacademy.ru/profession/react
- «Node.js, уровень 1» - htmlacademy.ru/intensive/nodejs
- «PHP, уровень 1» - htmlacademy.ru/intensive/php
- «PHP, уровень 2» - htmlacademy.ru/intensive/php2
Пікірлер: 59
По промокоду «YouMeow» скидка 900 рублей на интенсив или программу профессии в Академии - tml.io/mbf87
HTML Шорты - отличная рубрика. Спасибо!
Спасибо,за очередное интересное и познавательное видео.Есть стимул погружаться всё глубже в изучение html и css)Жду новых выпусков!)
было бы очень интересно услышать ответ на вопрос в одном из следующих выпусков: как правильно и рационально использовать блоки-врапперы в HTML-файлах. часто просматриваю код сайтов (особенно это касается CMS), и недоумеваю: зачем так много лишних блоков. официальная документация html довольно сложна, и найти ответ на этот вопрос мне очень сложно.
@HTMLAcademyTV
7 жыл бұрын
Спасибо за вопрос, разберём
@RealDeilan
7 жыл бұрын
Да, это очень актуальный вопрос для начинающих. На интенсивах и курсах Академии всевозможные обёртки используются повсеместно, но какие базовые принципы лежат за этим прямо не объясняется, а новичку сходу понять и разобраться в этом непросто.
Спасибо! Теперь буду чуть больше понимать подкаст)
Вижу новое виде - ставлю лайк
Молодчина! И даже не поленился приатачить ссылки.
За этот шорт огромное спасибо!
"Но уже пришло время пробовать и уметь." - Спасибо! Будем пробовать.:)))
Спасибо. Очень интересно!!!
Спасибо!
Расскажите пожалуйста про заголовки - . Можно ли использовать несколько на странице? В примерах спецификации много, но меня не покидает сомнения, что я где-то читал о том, что может быть только один.
@HTMLAcademyTV
7 жыл бұрын
Расскажем и очень скоро 👀
спасибо за очередное полезное видео) узнала много нового, захотелось познакомиться с этим интересным зверем поподробнее))
Классная футболка в каждом выпуске)))
@pepelsbey
7 жыл бұрын
Скоро футболки начнут кончаться! Но пока есть запас.
Пока не понял о чем это, но спасибо.
При создании меню в виде списка ссылок (`ul>li>a`) часто возникает неоднозначность: какие классы вешать на элементы списка `li`, а какие - на ссылки `a`? Расскажите про это, пожалуйста. :)
@4esnog
7 жыл бұрын
Всё зависит от задачи и ситуации) Если, например, этот список - действительно текстовый список (и ссылки в нём тоже inline-), можно ограничиться только `a`. В общем случае, думаю, расположение и позиционирование - на `li`, украшательства - на `a`. Но опять же, цели могут быть очень разные
@HTMLAcademyTV
7 жыл бұрын
Спасибо за вопрос
При создании отступов между родительским элементом и его дочерними элементами в каких случаях надо использовать padding'и у родителя, а в каких - margin'ы у его дочерних элементов? При расположении двух элементов относительно друг друга какому из них выставлять margin: левому/верхнему или правому/нижнему?
@HTMLAcademyTV
7 жыл бұрын
Попробуем разобрать этот вопрос в будущих выпусках, спасибо
В случае, если я хочу хранить все переменные в одном файле, а использовать в другом (склеивая их после иди просто импортируя), то как узнать, что кастомное свойство «почему-то не было объявлено» заранее? Никак? Получается, нужно всё равно препроцессить по прежним правилам, чтобы они подставлялись сами в виде фолбэков?
@pepelsbey
7 жыл бұрын
Андрей Гурылёв нужно просто писать компоненты (как и функции в программировании) с дефолтным значениями.
Чем больше будет динамики в CSS, тем больше он будет похож на язык программирования. Т.е. уходя от JS приходим к извращенному JS. Это общая проблема концепции универсализации.
Накопил сразу несколько вопросов: 1) В чем семантическое отличие тегов menu и nav и как их правильно применять? 2) Часто встраиваю контентные изображения бэкграундом в инлайновые стили из-за очень удобных свойств background-size: cover/contain. Насколько правильно с точки зрения семантики использовать такой метод учитывая что нельзя прописать атрибут alt
@HTMLAcademyTV
7 жыл бұрын
Спасибо за вопросы, расскажем
@alexeylivadniy6707
7 жыл бұрын
nav - только для основного блока навигации должен применяться (www.w3schools.com/tags/tag_nav.asp). А menu - это кастомные менюхи в веб-приложениях, возможное переопределение контекстного меню, наборы кастомных команд и все такое (www.w3schools.com/tags/tag_menu.asp)
Расскажите про необязательные HTML-теги, которые гугл (в своем styleguide) рекомендует не использовать. Думаю многие даже не знают точно какие теги являются необязательными, но лично меня больше интересует какие плюсы это дает и стоит ли слушать умельцев из гугла?
@HTMLAcademyTV
7 жыл бұрын
Спасибо за интересный вопрос, расскажем
@shama3720
7 жыл бұрын
HTML Academy мне тоже интересно!
Вещь хорошая, но увы, IE, их не поддерживает. И Edge до 15й версии тоже а в 15 указан частичный саппорт с багами. Что делать? Забить на совместимость с IE, или делать 2 версии сайта?
@pepelsbey
7 жыл бұрын
Андрей Францев об этом в самом конце ролика: полной поддержки пока нет, но знать и уметь уже вполне можно. В видео по ссылке в описании рассказано, как их уже использует Яндекс.
@artempolukarov6155
7 жыл бұрын
Забить. Я забил. ))
@pepelsbey
7 жыл бұрын
Все мои эксперименты с Edge 15 и кастомными свойствами прошли гладко, а я делал сложные штуки.
@artem_r
7 жыл бұрын
можно использовать полифилы - файлы стилей будут взяты из кеша и на них применить маппинг переменных из js. будет фликеринг, но пользователям ИЕ не привыкать к странному интернету
@artempolukarov6155
7 жыл бұрын
Artem Riasnianskyi они и не вкурсе, что интернет вообще нормальный. :D
Я не использую препроцессоры. Попробывал - уж слишком много мусора генерируют
Предположу, что и препроцессоры не будут стоять на месте, будут появляться всё новые, с новыми классными плюшками. При таком раскладе препроцессоры все равно будут находиться на один шаг впереди перед нативным CSS. Как вы считаете?
@dmitrysemigradsky764
7 жыл бұрын
Никто не мешает комбинировать. Например, использовать PostCSS, чтобы использовать необходимые плюшки от препроцессоров, но при этом не сильно завязываться на их синтаксис.
@PaulNekrasov
7 жыл бұрын
Мне кажется вы не внимательно смотрели, ПРЕпроцессоры на то и ПРЕ, что после того как стили собрали, о них можно забыть. О какой шаге впереди идет речь? Только нативная поддержка дает динамику изменений "после сборки"
Почему, если речь идёт о крупных проектах, то само собой полагается, что в них должен присутствовать препроцессор стилей? В чём удобства препроцессоров для типичной средней команды разработки (когда рефактор никто не оплачивает, когда никто особо не пишет доку, и так далее)?
@pepelsbey
7 жыл бұрын
Dmitry Anderson главным образом, переменные с цветами и организация модульности.
@almazmusic
7 жыл бұрын
сколько не видел таких проектов - цвета были в сплошном бардаке, т.к. и по оттенку разбросаны (хорошо хоть в одном файле были), и называл кто как мог, и ещё ряд проблем. А про модульность что конкретно имелось в виду? Я лично в таких проектах видел только проблемы, т.к. люди писали вложенностями и часто глядя в середину или конец большого компонента не очень понятно что такое: .item { display: block }. И чтобы в голове отрезолвить такое, приходилось подыматься вверх на уровней 4-5 точно и компилировать в уме. В общем то честно, никогда не видел преимуществ в использовании препроцессоров в больших проектах. Возможно дело в текучке людей на тех проектах, возможно ещё в чём-то, но определённо хотелось услышать мнение кого-то, кто работал в команде на стилевых препроцессорах. Спасибо.
@KocaHocTpa
7 жыл бұрын
Активно используем у себя препроцессоры. Если писать придерживаясь какой либо методологии то все просто замечательно. Например у нас БЭМ. Стили разбиты по файлам по имени Блоков (компоненты), отдельно вынесены цвета, отдельно типографика. Стили для мобильных так же отделены от десктопных. Но что бы все было так радужно нам пришлось: 1. Согласовать для всех верстальщиков структуру папок и файлов при разработке. 2. Стайлгайд написания стилей ( элементарные вещи типа максимальной глубины вложенности, именования переменных и тд и тп )
@almazmusic
7 жыл бұрын
Ну вот на то, что вам "пришлось" не везде есть время к сожалению :(
@KocaHocTpa
7 жыл бұрын
Dmitry Anderson ну не сказал бы что много времени надо. Сначало обсудили базовые вещи + решили использовать БЭМ. Я за пару вечеров написал простой набор тасков для галпа. А потом от проекта к проекту стайлгайд обрастал подробностями + появилось много нюансов уже прописанных заранее.
На принте Мохнатая гора IE, не иначе)
Ребята, есть такое пожелание - разделяйте как-то новые с пылу с жару фичи от тех, которые уже сейчас можно широко использовать. Иначе получается каша "обо всём интересном на свете", и это реально путает.
@pepelsbey
7 жыл бұрын
Мы явно говорим, что можно использовать, а что пока нет. Но всё очень зависит от проекта: для каких-нибудь админок внутри компании, где все на Safari и Chrome - почему бы и нет. Если будем рассказывать про фичи со 100% поддержкой в IE9, то будет очень скучно.
гриды!!! о гридах давайте
Трудно понимать видео с обилием этих терминов, особенно новичку. Желательно сделать какую-нибудь статью или список с кратким пояснением всех терминов которые будут встречать в процессе обучения. А также лучше адаптировать шорты под письменный язык когда выкладываете их на сайт как статьи. Ещё труднее понимать когда читаешь разговорный язык.
Очень жаль, что нельзя использовать переменные в медиа квери
@pepelsbey
7 жыл бұрын
Есть уже черновик, который позволяет писать специальный переменные для медиавыражений.
Не кастомные, а пользовательские свойства. Язык свой не стоит забывать.
кАстомный
Сколько реально зарабатывает программист kzread.info/dash/bejne/aXh_u9uRXc-8lpc.html