Chrome DevTools: Активация псевдокласса DOM-элемента

Псевдоклассы (active, focus, hover и visited) элемента можно триггерить вручную, например, если вам нужно посмотреть, как выглядит элемент при наведении на него курсора мыши.

Для этого кликните правой клавишей мыши на ноду на панели Elements и выберите нужный псевдокласс из контекстного меню (в старых версиях Chrome они были запрятаны в подразделе Force element state), либо кликните иконку Toggle element state на панели Styles.

Свидетельством применения пвсевдокласса будет маленький кликабельный оранжевый кружок-индикатор на выбранном узле возле открывающего тега и закрывающего (при условии, что он далеко).

Источник: https://www.kobzarev.com/dev-tips/2-pseudo-trigger/

Михаил Кобзарёв

Суровый русский тимлид. Жил в Магадане, в офисе московских веб студий и в Тульской деревне. Виртуозно знает WordPress, PHP, ООП, Vue.js и вот это вот все. Делает крутые высоконагруженные сайты, поэтому уже почти захватил весь рынок WordPress разработки в России. Не дает никому делать сайты без спроса. Ведет блог о разработке, дайджест в телеграмме и в ВК. Любит сиськи, баню и радиоэлектронику. 100% патриот (но это не точно). Тролль 542 уровня. Ездит в отпуск раз в 5 лет.

Добавить комментарий

%d такие блоггеры, как: