[검증] 진짜 아이폰(장치 픽셀 비교 2)이면 1px가 2px에 뜨나요?
검증 방법
이번에는 아이폰6(설비 픽셀 비교 2)의 환경에서 검증했다.
이런 환경에서 지정<meta name="viewport" content="width=device-width">하면 HTML/CSS에서 지정1px해도 실제 화면에2px된다.
문장 속의 언어는 각각 아래의 뜻이다.
문장 중
의향
HTML/CSS에서
CSS 픽셀(논리 픽셀)
실제 화면에서.
장치 픽셀(물리적 픽셀)
진짜인지 확인2px합니다.
아래와 같이 아이폰6을 사용하여 지정된 선1px의 HTML 파일을 표시합니다.
HTML<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>iPhone - test</title>
<style>
body { background: #000; padding: 20px; }
.bar { width: 100px; height: 100px; border: 1px solid #fff; }
</style>
</head>
<body>
<div class="bar"></div>
</body>
</html>
마이크로코드(상품:handymicron3, 광학줌:250배, 디지털줌:4배)로 아이폰6 화면을 찍었다.
결실
화면에 나타난 직사각형의 오른쪽 하단을 촬영했다.
실제 HTML/CSS에서 1px로 지정된 것은 화면에 2px로 표시됩니다.
note
노트도 기사를 공개했으니 관심 있는 분들은 보세요.
・[초보자를 위한 Codriding] PHP의 TODO 앱 코드를 읽어봅시다.
Reference
이 문제에 관하여([검증] 진짜 아이폰(장치 픽셀 비교 2)이면 1px가 2px에 뜨나요?), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/7968/items/e5dfea660d815a199300
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>iPhone - test</title>
<style>
body { background: #000; padding: 20px; }
.bar { width: 100px; height: 100px; border: 1px solid #fff; }
</style>
</head>
<body>
<div class="bar"></div>
</body>
</html>
화면에 나타난 직사각형의 오른쪽 하단을 촬영했다.
실제 HTML/CSS에서 1px로 지정된 것은 화면에 2px로 표시됩니다.
note
노트도 기사를 공개했으니 관심 있는 분들은 보세요.
・[초보자를 위한 Codriding] PHP의 TODO 앱 코드를 읽어봅시다.
Reference
이 문제에 관하여([검증] 진짜 아이폰(장치 픽셀 비교 2)이면 1px가 2px에 뜨나요?), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/7968/items/e5dfea660d815a199300
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
Reference
이 문제에 관하여([검증] 진짜 아이폰(장치 픽셀 비교 2)이면 1px가 2px에 뜨나요?), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/7968/items/e5dfea660d815a199300텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
