1. Эмуляция датчиков устройства
На нижней части вкладки Elements в Emulation -> Sensors помещается вкладка Sensors. Там имитируются сенсорные экраны и акселерометры. При желании можно даже указать географические координаты.
2. Выбор цвета с точностью до пикселя
Если в редакторе кликнуть образец цвета, появится экранная пипетка в виде лупы. Вы сможете указать цвет на одной из открытых страниц с точностью до одного пикселя.
3. Симуляция принудительного состояния
В редакторе свойств CSS для каждого элемента можно включить симуляцию DOM - состояний :hover и :focus. Это поможет вам правильно писать стили для этих свойств.
4. Показать скрытые объекты shadow DOM
Поля ввода и кнопки обычно при написании не видны. Однако перейдя в Settings -> General вы можете включить Show user agent shadow DOM. Это сделает их видимыми и даст возможность работать с ними по отдельности.
5. Редактировать следующие вхождения
Если на вкладке Source нажать при редактировании кода файлов Ctrl + D (Cmd + D), то откроются все вхождения выделенного слова. Это дает возможность редактировать несколько вхождений одновременно.
6. Смена цветового формата
В редакторе CSS-стилей есть возможность изменить формат отображения цвета на RGBA, HSL шестнадцатеричный. Для этого надо кликнуть по образцу цвета, удерживая Shift. Результаты могут вас приятно удивить, однако отобразятся не во всех браузерах.
7. Как редактировать файлы в рабочей области
Для настройки рабочей области надо включить панель навигации, перейти во вкладку Sources и перетащите вкладку проекта в панель разработчика. Теперь вы можете работать с папкой проекта независимо от того, какая вкладка открыта.
Удачи вам! Пару подсказок по инструментам Chrome для веб-разработчика дала вам Веб-студия "АКРИТ". Разработка и продвижение сайтов на CMS «1С-Битрикс». Мы реализуем полный цикл работ - от разработки логотипа и фирменного стиля будущей компании, до ее продвижения на рынок, используя максимально эффективные современные технологии.
Назад в раздел
На нижней части вкладки Elements в Emulation -> Sensors помещается вкладка Sensors. Там имитируются сенсорные экраны и акселерометры. При желании можно даже указать географические координаты.
2. Выбор цвета с точностью до пикселя
Если в редакторе кликнуть образец цвета, появится экранная пипетка в виде лупы. Вы сможете указать цвет на одной из открытых страниц с точностью до одного пикселя.
3. Симуляция принудительного состояния
В редакторе свойств CSS для каждого элемента можно включить симуляцию DOM - состояний :hover и :focus. Это поможет вам правильно писать стили для этих свойств.
4. Показать скрытые объекты shadow DOM
Поля ввода и кнопки обычно при написании не видны. Однако перейдя в Settings -> General вы можете включить Show user agent shadow DOM. Это сделает их видимыми и даст возможность работать с ними по отдельности.
5. Редактировать следующие вхождения
Если на вкладке Source нажать при редактировании кода файлов Ctrl + D (Cmd + D), то откроются все вхождения выделенного слова. Это дает возможность редактировать несколько вхождений одновременно.
6. Смена цветового формата
В редакторе CSS-стилей есть возможность изменить формат отображения цвета на RGBA, HSL шестнадцатеричный. Для этого надо кликнуть по образцу цвета, удерживая Shift. Результаты могут вас приятно удивить, однако отобразятся не во всех браузерах.
7. Как редактировать файлы в рабочей области
Для настройки рабочей области надо включить панель навигации, перейти во вкладку Sources и перетащите вкладку проекта в панель разработчика. Теперь вы можете работать с папкой проекта независимо от того, какая вкладка открыта.
Удачи вам! Пару подсказок по инструментам Chrome для веб-разработчика дала вам Веб-студия "АКРИТ". Разработка и продвижение сайтов на CMS «1С-Битрикс». Мы реализуем полный цикл работ - от разработки логотипа и фирменного стиля будущей компании, до ее продвижения на рынок, используя максимально эффективные современные технологии.
Назад в раздел
Подписаться на новые материалы раздела:
