Коллекция Material тем для DevTools браузера Chrome
Кобзарёв Михаил
2020-02-05T15:10:48+00:00
Браузеры
Коллекция Material тем для DevTools браузера Chrome
Material DevTools Theme Collection — это расширение для браузеров на основе Chromium (Chrome, Opera, Vivaldi), которое портирует известную Material Theme для инструментов разработчика DevTools.
Как установить Google Chrome в Ubuntu 19.10
Кобзарёв Михаил
2019-11-07T15:39:46+00:00
Linux
Как установить Google Chrome в Ubuntu 19.10
В этой короткой заметке мы научимся устанавливать браузер Google Chrome в Ubuntu 19.10 Eoan Ermine напрямую из deb-пакета, минуя установку из snap-пакета.
Отключение подсказок на вкладках Chrome 78 и выше
Кобзарёв Михаил
2019-10-31T10:34:34+00:00
Браузеры
Отключение подсказок на вкладках Chrome 78 и выше
Если вы обновили ваш Google Chrome до версии 78, то, наверное, сразу заметили бесячие всплывающие подсказки на табах при наведении на них мышкой, которые легко отключаются.
WordPress — это дорого?
Кобзарёв Михаил
2021-02-16T21:09:44+00:00
Разное
WordPress — это дорого?
Ежедневно сталкиваюсь с одним и тем же вопросом от клиентов, пользователей в чатах, товарищей и друзей: «WordPress — это дорого?».
Решил ответить сразу всем: «WordPress — это бесплатно, так как опенсорс». Так если он бесплатный, за что же я тогда беру деньги с людей, спросите вы, не мошенник ли я?
Chrome DevTools: перейти к линии в определённой колонке
Кобзарёв Михаил
2018-01-20T16:55:37+00:00
Dev Tips
Chrome DevTools: перейти к линии в определённой колонке
Чтобы перейти сразу к нужному месту в открытом файле на панели «Sources», воспользуйтесь хоткеем Cmd + O , указав желаемую позицию в формате :строка:столбец.
Chrome DevTools: копирование изображения как data URI
Кобзарёв Михаил
2018-01-15T18:19:41+00:00
Dev Tips
Chrome DevTools: копирование изображения как data URI
Если вам понадобится base64-копия любого изображения, отображаемого на странице в формате data URI для вставки, например, в CSS, то его легко можно получить при помощи DevTools.
Chrome DevTools: поиск в DOM-дереве по CSS-селекторам
Кобзарёв Михаил
2017-11-13T13:48:59+00:00
Dev Tips
Chrome DevTools: поиск в DOM-дереве по CSS-селекторам
На панели инструментов «Elements» в DevTools можно искать элементы в DOM-дереве, используя CSS-селекторы.
Chrome DevTools: Простая запись происходящего на экране
Кобзарёв Михаил
2017-09-18T18:28:33+00:00
Dev Tips
Chrome DevTools: Простая запись происходящего на экране
Если вам понадобилось записать что-либо происходящее на странице при помощи панели «Timeline», то попробуйте вот что.
Chrome DevTools: Отслеживание изменений файлов
Кобзарёв Михаил
2017-09-08T15:33:09+00:00
Dev Tips
Chrome DevTools: Отслеживание изменений файлов
Фича под названием «Local modifications» позволяет вам отслеживать изменения файлов, сделанные внутри DevTools.
Chrome DevTools: Запуск предзаданных сниппетов кода на любой странице
Кобзарёв Михаил
2017-09-13T21:12:46+00:00
Dev Tips
Chrome DevTools: Запуск предзаданных сниппетов кода на любой странице
В DevTools есть замечательная фича, называемая сниппетами (небольшие кусочки кода). Сниппеты можно создавать (или удалять) и запускать в контексте любой веб-страницы (что, согласитесь, удобнее, чем каждый раз набирать один и тот же код в консоли браузера).
Chrome DevTools: Повторить сетевой запрос в cURL
Кобзарёв Михаил
2017-09-13T21:12:55+00:00
Dev Tips
Chrome DevTools: Повторить сетевой запрос в cURL
Любой из ресурсов на панели Network имеет контекстное меню, которое позволяет копировать запрос в виде терминальной команды curl. При это в буфер попадает не только сам URL и его параметры, но и заголовки.
При желании, после вставки строки с запросом в консоль её можно подправить, а уж потом жмакать клавишу Enter.
В примере используется Numbers API.
Chrome DevTools: Активация псевдокласса DOM-элемента
Кобзарёв Михаил
2017-09-04T00:17:23+00:00
Dev Tips
Chrome DevTools: Активация псевдокласса DOM-элемента
Псевдоклассы (active, focus, hover и visited) элемента можно триггерить вручную, например, если вам нужно посмотреть, как выглядит элемент при наведении на него курсора мыши.
Для этого кликните правой клавишей мыши на ноду на панели Elements и выберите нужный псевдокласс из контекстного меню (в старых версиях Chrome они были запрятаны в подразделе Force element state), либо кликните иконку Toggle element state на панели Styles.
Свидетельством применения пвсевдокласса будет маленький кликабельный оранжевый кружок-индикатор на выбранном узле возле открывающего тега и закрывающего (при условии, что он далеко).
Chrome DevTools: Перенаправление порта для открытия локальных ссылок на мобилке
Кобзарёв Михаил
2017-09-03T23:52:52+00:00
Dev Tips
Chrome DevTools: Перенаправление порта для открытия локальных ссылок на мобилке
- Откройте локальный URL в браузере Google Chrome на декстопе
- Включите удаленную отладку и перенаправление порта
- Обновите страницу и вы увидите, как всё чётко работает без использования командной строки!
Переключение вкладок Google Chrome при помощи колеса мыши в Windows
Кобзарёв Михаил
2017-04-14T10:34:57+00:00
Разное
Переключение вкладок Google Chrome при помощи колеса мыши в Windows
В браузере Google Chrome под Linux есть одна очень удобная функция — переключение вкладок при помощи колеса мыши, а вот в Windows этого очень не хватает. Давайте это поправим.
Начинаем работать с Payment Request API
Кобзарёв Михаил
2016-12-29T18:42:51+00:00
Программирование
Начинаем работать с Payment Request API
Оплата товаров через интернет может оказаться страшной головной болью, не так ли? Вас постоянно заставляют вводить одни и те же реквизиты банковских карт и контактные данные.
Особенно тяжело это дается на мобильном телефоне. Как давно вы в последний раз отказывались от покупки вещи по причине сложностей с заполнением формы оплаты? У меня такое было прошлой ночью.
Отладка IE11 в Google Chrome
Кобзарёв Михаил
2016-10-03T19:22:13+00:00
Soft
Отладка IE11 в Google Chrome
IE Diagnostics Adapter — это прокси-сервер, который позволяет отлаживать и диагностировать IE, используя Chrome remote debug protocol.
Компрессия данных в настольной версии Google Chrome при помощи Data Compression Proxy
Кобзарёв Михаил
2016-10-03T19:43:41+00:00
Браузеры
Компрессия данных в настольной версии Google Chrome при помощи Data Compression Proxy
Как известно, в мобильной версии Google Chrome для ускорения загрузки веб-страниц и уменьшения объема передаваемых данных используется технология сжатия трафика на лету.
На десктопой же версии этого браузера данной функции нет, но её можно «включить», используя специальное расширение.
Сброс кеша DNS в Google Chrome
Кобзарёв Михаил
2018-09-27T10:27:57+00:00
Браузеры
Сброс кеша DNS в Google Chrome
Введите в адресной строке браузера chrome://net-internals/#dns и нажмите кнопку Clear host cache.
Пользовательские скроллбары в WebKit
Кобзарёв Михаил
2016-10-03T22:50:06+00:00
Верстка
Пользовательские скроллбары в WebKit
Вернёмся назад, когда вы могли настроить скроллбары в IE (5.5) с помощью нестандартных свойств типа scrollbar-base-color, которые применялись к элементам с полосами прокрутки (вроде body), и делать потрясные штуки. IE теперь не тот.
Property ‘submit’ of object #<HTMLFormElement> is not a function
Кобзарёв Михаил
2016-10-03T23:22:24+00:00
Программирование
Property ‘submit’ of object #<HTMLFormElement> is not a function
Если вы вдруг получили такую ошибку при отправке формы — проверьте, не названа ли кнопка отправки формы submit.
Стилизуем веб-инспектор Google Chrome
Кобзарёв Михаил
2020-02-05T08:30:29+00:00
Браузеры
Стилизуем веб-инспектор Google Chrome
Если вам не нравится стандартная цветовая схема веб-инспектора Google Chrome, вы всегда можете поменять её на любую другую. Для этого достаточно написать свои стили в файле Custom.css.
Меняем форму значков для полей ввода пароля
Кобзарёв Михаил
2016-10-04T15:37:04+00:00
Верстка
Меняем форму значков для полей ввода пароля
По умолчанию для полей type=password браузер рисует закрашенные кружки вместо символов. Что делать, если кружки надо заменить, например, на квадраты. Тут нам на помощь придет CSS3.
Убрать желтый фон у полей с autocomplete в Google Chrome
Кобзарёв Михаил
2021-05-27T16:50:10+00:00
Верстка
Убрать желтый фон у полей с autocomplete в Google Chrome
В браузерных стилях Google Chrome для полей с autocomplete прописан желтый (#FAFFBD) фон и черный (#000000) цвет текста, усиленные при помощи !important, соответственно, переопределить их в пользовательских таблицах стилей нельзя. Выхода вижу всего два.
Live Edit в PhpStorm
Кобзарёв Михаил
2016-10-07T02:48:19+00:00
Soft
Live Edit в PhpStorm
Функция Live Edit в PhpStorm совместно с плагином под браузер Google Chrome позволяют редактировать PHP/HTML/CSS/JS в реальном времени без перезагрузки страницы. Вы правите что-то в среде разработки — результат моментально отображается в браузере.
Пишем в консоль браузера из PHP
Кобзарёв Михаил
2016-10-07T11:56:19+00:00
Браузеры
Пишем в консоль браузера из PHP
1. Скачайте и установите расширение Google Chrome из Extension Gallery.
2. Кликните на иконку расширения для включения возможности писать в консоль браузера для текущего домена.
Установка Google Chrome в Ubuntu 12.04
Кобзарёв Михаил
2016-10-07T12:20:30+00:00
Linux
Установка Google Chrome в Ubuntu 12.04
Браузером по умолчанию в Ubuntu является Firefox. Не всех это устраивает. Кому-то больше нравится Google Chrome — который является самым популярным браузером в мире по данным StatCounter Global Stats.
Пуленепробиваемый @font-face
Кобзарёв Михаил
2020-01-31T10:39:58+00:00
Верстка
Пуленепробиваемый @font-face
Современный способ внедрения шрифтов на веб-страницу.
Google Chrome 13
Кобзарёв Михаил
2016-10-11T20:49:36+00:00
Браузеры
Google Chrome 13
Компания Google выпустила релиз браузера Chrome 13, доступный для платформ Linux, MacOS X и Windows.
Новый способ очистки «плавающих» блоков
Кобзарёв Михаил
2016-10-11T22:16:34+00:00
Верстка
Новый способ очистки «плавающих» блоков
Clearfix — полезный метод для очистки плавающих блоков. Оригинальный clearfix hack работает просто великолепно, но браузеры устаревают, и нужно двигаться в ногу с прогрессом.
