Как же я благодарен разработчикам за эти два, казалось бы простых, но таких полезных дополнения для VisualStudio Code!
1. Better comments - позволяет создавать и использовать кастомные тэги в комментариях, длагодаря чему комментарии разукрашиваются в различные, заданные в настройках цвета.
2. Comment Anchors - позволяет создавать якорные ссылки комментариев, поддерживает вложенность якорей, наподобие древовидной структуры. Панель ссылок открывается отдельным значком в боковой панели.
Без этих двух приблуд моя жизнь была адом, особенно когда кода становится 5 и больше 10 тысяч строк и ты уже не понимаешь, где что написано.
1. Better comments - позволяет создавать и использовать кастомные тэги в комментариях, длагодаря чему комментарии разукрашиваются в различные, заданные в настройках цвета.
2. Comment Anchors - позволяет создавать якорные ссылки комментариев, поддерживает вложенность якорей, наподобие древовидной структуры. Панель ссылок открывается отдельным значком в боковой панели.
Без этих двух приблуд моя жизнь была адом, особенно когда кода становится 5 и больше 10 тысяч строк и ты уже не понимаешь, где что написано.
Друзья, у меня на канале собралась первая сотня подписчиков. За что, конечно же, вам всем огромное спасибо! В связи с этим, нежданно, негаданно проведу стрим сегодня в 20:00. Заходите, будет лампово )))
https://youtu.be/9HYBkCukCrE
https://youtu.be/9HYBkCukCrE
Ребятки, осталось 30 минут до стрима! Кто ещё не присоединился - присоединяйтесь!
https://youtu.be/9HYBkCukCrE
https://youtu.be/9HYBkCukCrE
YouTube
Неожиданный стрим. 100 подписчиков.
Поздравим друг-друга и сами себя, поговорим.
👨👨👧👦 Тележечка: https://bit.ly/css_notes
🤹♂️ Личка: https://bit.ly/serdyuk
📖 Полезные ссылки:
Спецификация HTML live standart: https://html.spec.whatwg.org/
🧩 Сборка Gulp, про которую все спрашивают: ht…
👨👨👧👦 Тележечка: https://bit.ly/css_notes
🤹♂️ Личка: https://bit.ly/serdyuk
📖 Полезные ссылки:
Спецификация HTML live standart: https://html.spec.whatwg.org/
🧩 Сборка Gulp, про которую все спрашивают: ht…
Запись стрима обязательно появится сразу после обработки ютубом!
https://youtu.be/9HYBkCukCrE
https://youtu.be/9HYBkCukCrE
YouTube
Неожиданный стрим. 100 подписчиков.
Поздравим друг-друга и сами себя, поговорим.
👨👨👧👦 Тележечка: https://bit.ly/css_notes
🤹♂️ Личка: https://bit.ly/serdyuk
📖 Полезные ссылки:
Спецификация HTML live standart: https://html.spec.whatwg.org/
🧩 Сборка Gulp, про которую все спрашивают: ht…
👨👨👧👦 Тележечка: https://bit.ly/css_notes
🤹♂️ Личка: https://bit.ly/serdyuk
📖 Полезные ссылки:
Спецификация HTML live standart: https://html.spec.whatwg.org/
🧩 Сборка Gulp, про которую все спрашивают: ht…
Я во время стрима не ответил на вопрос про дивы. Обязательно запишу короткий видос про них завтра днём. Всем бобра и семантику!
Forwarded from Веб-страница
13 способов стилизации списков
Не любите списки? Да вы просто не умеете их готовить!
В своей статье автор делится нетривиальными способами стилизации. Всё оформлено в CodePen, так что можно потыкать код, не отходя от кассы.
https://tprg.ru/BOgt
#фронтенд #css
Не любите списки? Да вы просто не умеете их готовить!
В своей статье автор делится нетривиальными способами стилизации. Всё оформлено в CodePen, так что можно потыкать код, не отходя от кассы.
https://tprg.ru/BOgt
#фронтенд #css
Просто и понятно про БЭМ на примере стейка:
.корова- блок
.корова__спина- элемент (не может существовать отдельно от блока)
.корова__спина-мышца.вырезка- микс (вырезка, как кусок мяса - отдельная сущность, но входит в состав коровы, как её мышца)
.корова__спина-стейк.вырезка__филе-миньон- микс двух элементов разных блоков
.корова__спина-стейк.вырезка__филе-миньон—медиум-рейр- модификатор означает степень прожарки
Forwarded from HTML Academy
Гриды для раскладки, флексбокс для компонентов. Разбираемся, что и в каких ситуациях использовать.
https://ishadeed.com/article/grid-layout-flexbox-components/
https://ishadeed.com/article/grid-layout-flexbox-components/
Этот пост не про CSS, но о человечности. Моего знакомого, которого не раз встречал на разных политических акциях судят за то, что он смог отбиться от нападавших на него людей. У одного из них он выбил нож и нанёс, как позже оказалось, смертельный удар в область живота. Нападение было уже ТРЕТЬИМ по счёту и он просил защиты у государства, которое отморозилось. Поэтому извините, оффтоп, но я поддержу Серёжу Стерненко в его праве на самооборону.
Forwarded from INTOLERANT PATRIOT
Підтримувати активіста Сергія Стерненка – підтримувати право на самозахист.
У вас може бути різне ставлення до Стерненка, але якщо ви вболіваєте за його ув’язнення, то ваша позиція дуже підозріло збігається з позицією Шарія, Портнова, Медведчука та інших агентів ФСБ. Ми, адміни українських телеграм-каналів, усвідомлюємо відповідальність перед своїми аудиторіями, заявляємо, що всебічно підтримуємо активіста Сергія Стерненка.
Підтримують:
@ukrnastup
@teterivonelove
@tasty_flashbacks
@dvish_live
@knpu_division
@Ironvoter
@privatnamemarnya
@philiszanka
@fastnews_ua
@polcringe
@borykva
@guliajpole
@taburetkax
@kropyvamemes
@not_understandable
@vantazhivka
@nechudopi4
@direview
@Legion_of_Kuchma
@nationalpolpotism
У вас може бути різне ставлення до Стерненка, але якщо ви вболіваєте за його ув’язнення, то ваша позиція дуже підозріло збігається з позицією Шарія, Портнова, Медведчука та інших агентів ФСБ. Ми, адміни українських телеграм-каналів, усвідомлюємо відповідальність перед своїми аудиторіями, заявляємо, що всебічно підтримуємо активіста Сергія Стерненка.
Підтримують:
@ukrnastup
@teterivonelove
@tasty_flashbacks
@dvish_live
@knpu_division
@Ironvoter
@privatnamemarnya
@philiszanka
@fastnews_ua
@polcringe
@borykva
@guliajpole
@taburetkax
@kropyvamemes
@not_understandable
@vantazhivka
@nechudopi4
@direview
@Legion_of_Kuchma
@nationalpolpotism
Forwarded from Веб-стандарты (Веб-стандарты)
Новинки Safari 14 в ближайших релизах macOS и iOS: WebP, веб-расширения, HTTP/3, отказ от Flash, BigInt, logical assignment и публичные поля классов, кастомные EventTarget, расширенный image-set в CSS, псевдоселекторы :is() и :where(), image-orientation https://developer.apple.com/documentation/safari-release-notes/safari-14-beta-release-notes
Forwarded from Веб-стандарты (Вадим Макеев)
Выпуск №235: Евангелист Safari, Bootstrap 5, content-visibility, гриды, чекбоксы, forms, API для PWA. Слушайте на Ютубе https://youtu.be/3QExB7SK5bY, читайте на Медиуме https://medium.com/p/7673629b7d01
Forwarded from Марафон по верстке
Марафон по HTML/SCSS/Gulp верстке сайтов!
Для старичков ! =)
⏰Когда: с 3 по 5 июля 3 дня, начало в 18:00
🎥Формат: прямой эфир
Бесплатный марафон по верстке, буду практически использовать Gulp и SCSS, объяснять свои действия, добавим анимах, обязательно адаптив, без него страшно)
🎬 Видео о марафоне, и канал автора:
https://youtu.be/ZcYo-xqhBcs
Для старичков ! =)
⏰Когда: с 3 по 5 июля 3 дня, начало в 18:00
🎥Формат: прямой эфир
Бесплатный марафон по верстке, буду практически использовать Gulp и SCSS, объяснять свои действия, добавим анимах, обязательно адаптив, без него страшно)
🎬 Видео о марафоне, и канал автора:
https://youtu.be/ZcYo-xqhBcs
YouTube
Марафон по HTML/SCSS/GULP верстке сайтов! Для старичков ! =)
Ссылка на телеграм канал:
https://t.me/from0to1com
https://t.me/from0to1com
В поисках возможности проверить функционал сайта на телефоне с помощью
Инструкция от Гугла здесь. Приятного использования.
console.log(); нашёл, что оказывается, можно открыть на компьютере консоль с браузера телефона.Инструкция от Гугла здесь. Приятного использования.
Chrome for Developers
Chrome DevTools | Chrome for Developers
Debug and optimize your web applications with Chrome DevTools.
Forwarded from Веб-стандарты (Вадим Макеев)
Выпуск №236: Онлайн-доклады, новинки DevTools, новости Safari 14, Date и Temporal, TypeScript 4 и зачем TS. Слушайте на Ютубе https://youtu.be/TicJyAYPEUQ, читайте на Медиуме https://medium.com/p/5919f4f412da
Forwarded from Веб-стандарты (Веб-стандарты)
Прямая трансляция Web.Dev Live начнётся в 19:00 (GMT+3). В программе: инструменты тестирования перфоманса, измерение и отладка метрик Web Vitals, отчёт Chrome UX, анализ JS-бандлов, AMP, SEO.
Программа https://web.dev/live/
Трансляция https://youtu.be/H89hKw06iWs
Программа https://web.dev/live/
Трансляция https://youtu.be/H89hKw06iWs
Ссылка или кнопка?
Ссылка:
- ведёт на другую страницу (меняется URL);
- ведёт по якорю к элементу сайта;
- даёт скачать файл (
- открывает приложение (ссылка mailto: tel: skype: и т.п.);
- в случае другой необходимости (нужна для плагина и не работает иначе, нужно считывать именно атрибут href и никакой другой).
Даже если выглядит кнопкой!
Во всех остальных случаях это кнопка, даже если выглядит ссылкой!
Ссылка:
- ведёт на другую страницу (меняется URL);
- ведёт по якорю к элементу сайта;
- даёт скачать файл (
href="file:...");- открывает приложение (ссылка mailto: tel: skype: и т.п.);
- в случае другой необходимости (нужна для плагина и не работает иначе, нужно считывать именно атрибут href и никакой другой).
Даже если выглядит кнопкой!
Во всех остальных случаях это кнопка, даже если выглядит ссылкой!