Google Chrome 브라우저에서 요소 검사 기능 사용에 대한 팁을 원한다고 가정합니다. 검사하려는 요소를 마우스 오른쪽 버튼으로 클릭하고 드롭다운 메뉴에서 '검사'를 선택합니다. 키보드 단축키 Ctrl+Shift+I(Windows) 또는 Cmd+Opt+I(Mac)를 사용하여 Inspector를 열 수도 있습니다. 인스펙터가 열리면 왼쪽에는 페이지의 HTML이, 오른쪽에는 CSS가 표시됩니다. Inspector에서 HTML 및 CSS를 변경하고 이러한 변경 사항이 페이지에 즉시 적용되는 것을 확인할 수 있습니다. Inspector를 종료하려면 오른쪽 상단 모서리에 있는 X를 클릭하기만 하면 됩니다.
구글 크롬은 일반 웹 사용자 뿐만 아니라 웹사이트 제작, 블로그 제작 등을 자주 하는 웹 개발자를 위한 제품입니다. 체크 요소 또는 검사 Google 크롬 옵션은 사용자가 보기에서 숨겨진 웹 사이트에 대한 일부 정보를 찾는 데 도움이 됩니다. 다음은 Windows PC용 Google Chrome 브라우저에서 Inspect Element를 사용하기 위한 몇 가지 팁입니다.
Google 크롬 요소 확인
1] 숨겨진 JavaScript/미디어 파일 찾기
사용자 프로필 창 10 삭제
방문자가 웹 페이지에 15~20초 이상 머문 경우 많은 웹사이트에서 팝업이 표시됩니다. 또는 대부분의 경우 실수로 어딘가를 클릭한 후 이미지, 광고 또는 아이콘이 열립니다. 웹 페이지에서 이러한 숨겨진 파일을 찾으려면 다음을 사용할 수 있습니다. 출처 요소 탭을 검사합니다. 탐색할 수 있는 트리 모양의 목록이 왼쪽에 표시됩니다.
2] Chrome에서 HEX/RGB 색상 코드 가져오기
때때로 우리는 색상을 좋아하고 색상 코드를 알고 싶을 수 있습니다. Google 크롬의 기본 제공 옵션을 사용하여 특정 웹 페이지에 사용된 HEX 또는 RGB 색상 코드를 쉽게 찾을 수 있습니다. 색상을 마우스 오른쪽 버튼으로 클릭하고 선택 검사 . 대부분의 경우 오른쪽에 다른 CSS가 있는 색상 코드가 표시됩니다. 표시되지 않으면 무료 색상 선택기 소프트웨어를 사용해야 할 수 있습니다.
Windows 10에서 기본 프린터를 설정하는 방법
팁 : 이것 좀 보세요 온라인 색상 선택기 도구 같은.
Windows Aero 활성화
3] 웹 페이지 성능 향상을 위한 팁 얻기
누구나 빠르게 열리는 사이트를 방문하는 것을 좋아합니다. 웹사이트를 디자인하는 경우 항상 이 점을 염두에 두어야 합니다. 페이지 로드 속도를 테스트하고 최적화하는 많은 도구가 있습니다. 그러나 Google 크롬에는 사용자가 웹사이트 로딩 속도를 개선할 수 있는 팁을 얻을 수 있는 도구가 내장되어 있습니다. 이러한 도구에 액세스하려면 다음으로 이동하십시오. 심사 탭하고 확인 네트워크 사용량 , 웹 페이지 성능 , 나 로드 시 페이지 다시 로드 및 감사 선택된. 그런 다음 달리다 단추. 페이지를 다시 로드하고 페이지 속도를 높이는 데 사용할 수 있는 몇 가지 정보를 표시합니다. 예를 들어 캐시가 만료되지 않은 모든 리소스, 하나의 파일로 결합할 수 있는 JavaScript 등을 가져올 수 있습니다.
4] 테스트 응답성
요즘에는 웹 페이지를 반응형으로 만드는 것이 매우 중요합니다. 사이트가 완전히 반응하는지 확인할 수 있는 많은 도구가 있습니다. 하지만 이 Google 크롬 도구는 사용자에게 도움이 됩니다. 사이트가 반응하는지 여부를 알 수 있습니다. 또한 특정 모바일 장치에서 어떻게 보이는지 확인하십시오. 아무 사이트나 열고 체크 요소 탭, 클릭 이동하는 버튼을 클릭하거나 해상도를 설정하거나 원하는 기기를 선택하여 웹 페이지를 확인할 수 있습니다.
보안 부팅 Windows 10 비활성화
5] 라이브 웹사이트 편집
웹 페이지를 만들고 있지만 색 구성표, 탐색 메뉴 크기, 콘텐츠 또는 사이드바 종횡비가 무엇인지 모른다고 가정해 보겠습니다. Google 크롬에서 요소 검사 옵션을 사용하여 라이브 웹사이트를 편집할 수 있습니다. 라이브 웹 사이트에 대한 변경 사항을 저장할 수는 없지만 나중에 사용할 수 있도록 모든 편집 작업을 수행할 수 있습니다. 이렇게 하려면 요소 검사를 열고 왼쪽에서 HTML 속성을 선택한 다음 오른쪽에서 스타일을 변경합니다. CSS를 변경하는 경우 파일 링크를 클릭하고 모든 코드를 복사하여 원본 파일에 붙여넣을 수 있습니다.
PC 수리 도구를 다운로드하여 Windows 오류를 빠르게 찾아 자동으로 수정Google Chrome의 Inspect Element는 모든 웹 개발자의 진정한 동반자입니다. 단일 페이지 웹사이트를 디자인하든 동적 웹사이트를 디자인하든 이 팁을 통해 확실히 이점을 얻을 수 있습니다.
