크롬 개발자 도구 설정

Question

나는 다양한 <img>'s을 정렬하기 위해 크롬 개발 도구를 사용 해왔다. 나는 요소를 검사하고 css를 스타일 창에서 더하기 버튼을 클릭하여 자동으로 생성 된 선택기에 추가하여이 작업을 수행했습니다.

은 어떻게 든 자동 생성 된 CSS는 같은 작동하지 않습니다 즉 특정 요소에 대한 CSS를 생성하지 않는 이전과는

을 예컨대 이전

#framebox_3920691 > div > table > tbody > tr:nth-child(2) > td:nth-child(1) > a > img { 
} 

이제

img{ 
} 

어떤 아이디어가?

Answer 1

[매우 자세한] 선택기를 사용하는 것은 권장되지 않으며 유지 관리하기가 거의 어렵습니다. 특정 클래스/ID를 이미지에 할당하고 선택자에서 이미지를 사용하는 것이 좋습니다.

그렇다면 요소의 전체 CSS 경로가 필요하면 요소 패널에서 요소를 마우스 오른쪽 단추로 클릭하고 컨텍스트 메뉴에서 Copy CSS Path을 선택하여 시스템 클립 보드에 전체 CSS 경로를 가져옵니다.