아주 쉽게 브라우저의 현재 가로 세로값 알아내기!
사실 아주 간단하고 누구나 알고 있을 법한 내용인데, 혹시라도 처음 html과 css를 배우는 사람들에게 유용 할 것 같아 글을 써보려고 해요.
브라우저의 가로값은 반응형 웹사이트를 만들때 유용하게 사용할 수 있어요. 창이 어느정도 작아지는 시점에 요소들의 위치나 크기등을 변경해줘야 할 경우와 웹사이트가 완성 되었을때 잘 되었는지 체크할 경우에 가로값을 알면 유용합니다.
1. 크롬 브라우저 가로 세로값 확인 방법
F12를 눌러 DevTool를 켜줍니다. 그리고 화면의 가로 크기를 줄였다가 늘렸다 해보세요.
그럼 브라우저 오른쪽 상단에 가로 x 세로 크기가 뜹니다.
노란색 표시처럼 가로,세로크기를 알 수 있어요. 엄청간단 but 유용
2. 익스플로러 브라우저 가로 세로값 확인 방법'
동일하게 F12를 눌러 개발자 도구를 켜주세요. DOM탐색기 중 가장상단에 있는 <html>태그를 눌러줍니다. 그리고 레이아웃을 확인하면 가로 x세로 크기를 알 수 있습니다.
이렇게 레이아웃을 보면 가로 X 세로 크기를 알 수 있습니다. 브라우저의 크기를 조정하면 값이 변경됩니다.
이방법을 이용해서 미디어쿼리를 쓰실때 유용하게 사용하세요:-D
'퍼블리싱 > 기타정보' 카테고리의 다른 글
| 웹페이지 전체를 한번에 캡쳐하기 (0) | 2020.04.07 |
|---|---|
| 카톡 오픈그래프 메타태그 및 이미지 사이즈 & 캐시삭제 (4) | 2020.03.31 |
| 번역하기 옵션 없애는 방법 및 코드 (1) | 2020.03.26 |
| 티스토리/네이버 블로그 복사시 자동 출처 표기방법 (4) | 2020.03.23 |
| 페이스북 로그인 #_=_ 제거하기 (1) | 2020.03.20 |
