모바일코딩 2
[꿀정보] 트로이로 모바일 확인하기
안녕하세요. 플입니다. 오늘은 모바일 화면을 pc에서 확인하는 사이트를 알려드릴게요. 1. 다음 트로이 http://troy.labs.daum.net/ 사이트는 다음 트로이예요. 아마 아시는 분들도 많을 거예요. 이쪽에 모바일로 보고 싶은 주소를 입력하면 가운데 핸드폰 모양 화면에서 모바일 버전으로 사이트가 나오게 돼요. 신기하죠? 2. 주소 입력 이제 실제로 한번 해볼까요? 먼저 주소를 입력해요. 저는 제 포트폴리오 사이트 주소를 입력해줬어요. 이렇게 보면서 음 모바일도 잘 나오고 있군. 하고 확인하는 거예요. 3. 다른 모바일 기기 확인 나는 이 모바일 기기보다 조금 더 작거나 큰 화면을 확인하고 싶은데.. 하는 생각이 들 때가 있을 거예요. 그럴 때는 왼쪽에 있는 메뉴에서 원하는 모바일 기기를 선택..
[html] 뷰포트 설정하기
안녕하세요. 플입니다. 오늘은 뷰포트를 설정해보겠습니다. 1. 뷰포트(viewport) 뷰포트는 모바일 화면을 위해 꼭 필요한 태그입니다. 뷰포트를 설정 안 했을 때 화면입니다. 뷰포트를 설정했을 때 화면입니다. 어떤 차이가 있는지 확실히 느껴지시죠? 2. 뷰포트 설정 위에도 같은 코드를 적었는데요 이 메타태그를 태그 안에 넣어주시면 설정 완료입니다. 저렇게 메타태그를 넣어줍니다. 그럼 이만. 총총.