1. Elements 패널의 기능은?
개발자 도구를 열었을 때 가장 처음 표시되는 도구로,
브라우저의 구성, 스타일, 속성을 수정하고 확인할 수 있다.
하지만 테스트를 위주로 하기때문에 파일에 자동저장이 되진 않는다.
2. 해당 페이지는 몇 개의 section 으로 이루어져있나요?
- 5개
3. Instagram 피드의 가로 길이는?
🎈사이즈 확인하는 방법
개발자 도구를 켜고, 왼쪽상단 커서 모양을 클린한뒤,
원하는 엘리먼트에 마우스를 올리면 사이즈 확인이 가능
따라서, 정답은 161px로 확인
출처:https://phase-root-274.notion.site/7d3146079b064bff91dd54d02bedb31a
4. Styles 부분의 순서가 의미하는 것은?
HTML이 실행되었을때 가장 먼저 적용되는 순서대로 배치가 되어있다.
개발자가 기록한 CSS와는 순서가 다르며,
가장 상위태그인 html(inline style), ID, CLASS, TAG 순서대로 배치되어 있다.
5. user agent stylesheet 란?
margin 값을 정해두지 않아 브라우저 임의대로 설정한 것
사용자가 margin 값을 설정하지 않으면, 각 브라우저에서 디폴트 값으로 설정하게된다.
웹브라우저마다 기본적으로 디폴트 시트가 다르므로, 의도와는 다르게 화면에 표시될수 있다.
*inline css는 가장 지양되는 방법이다.
Console 패널의 기능은?
화면을 새로고침 해도 console 내용이 지워지지 않고 남게 하는 방법은?
preserve log
콘솔에 기록된 로그를 모두 지울 때 사용하는 메소드는?
- console.clear()
- 금지마크
콘솔에서 Warnings , Errors 내용을 제외하고 보는 방법은?
다른 패널(ex. Elements panel)에서 Console Panel 같이 보는 방법은?
