이전
목록
다음
허

[질문글 죄송] 폰트 크기가 다르게 출력되는 현상에 관하여

허정권
프로필 보기이 회원 글보기이 회원의 댓글보기
 · 2015-10-19 (월) 13:42:22 · 1273 · 6

보시는 바와 같이 같은 페이지를 표시하는데 폰트의 크기가 다르게 나오는군요...

 

혹시나 같은 현상을 겪어 보신 분이나 고민중이신 분

 

해결하기 위한 방법이 뭐가 있을까요 ㅠ

 

 

cde9ce11999862ea5b2d70760e17fb2e_1445229382_2219.png cde9ce11999862ea5b2d70760e17fb2e_1445229382_4599.png

왼쪽 이미지는 모바일 크롬에서 확인한 것이고요

오른쪽 이미지는 web2APP이라는 어플로 본 것입니다.

 

http://designhuh.phps.kr/study1015

에서 css 확인하실 수 있고요,

혹시나 해서 css를 남겨 놓습니다.(근본 없는 코딩이라 이해를 부탁드립니다. ㅠㅠ)

[code]

@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);

body{margin:0; padding:0; overflow-x:hidden; font-size:16px; font-family:'Noto Sans KR'sans-serif; font-weight:300; color:#666;}

h1, h2,h3, h4 {font-weight:bold; margin:0; padding:0;}

h1{font-size:3em;}

h2{font-size:2.5em;}

h3{font-size:2em;}

h4{font-size:1.5em;}

img{border:0; width:100%;}

.world{width:100%;}

.topbar{position:relative; width:100%; text-align:center; background-color:#C2185B; color:#fff; font-size:3em; font-weight:bold; text-transform:uppercase; padding:0.5em 0;}

.topbar i {margin:0; padding:0; position:absolute; top:50%; margin-top:-0.7em; left:0.5em; font-size:1em; background-color:#F06292; border-radius:10px; padding:10px 15px; cursor:pointer;}

.mainImg{position:relative; width:100%;}

.mainImg #mainimage{width:100%;}

.mainImg #maintext {position:absolute; top:50%; margin-top:-2.5em; width:100%; font-size:5em; text-align:center; color:#fff; font-weight:bold; text-shadow:2px 3px 5px black;}

.content{width:94%; padding:3%; text-align:justify;}

.row {width:100%; display:-webkit-flex; -webkit-flex-direction:row; -webkit-justify-content:space-between; margin-top:2em;}

.row #imagebox{width:49%;}

[/code]

 

 

#디자이너톡
|

댓글 6개

탈탈퇴회원
프로필 보기이 회원 글보기이 회원의 댓글보기
 2015-10-19 (월) 14:24:49
em --> px
상속과 절대 차이입니다.
허허정권
프로필 보기이 회원 글보기이 회원의 댓글보기
 2015-10-19 (월) 14:40:03
답변 감사합니다.
body에 16px로 폰트 크기를 정해놓았는데요,
같은 1em이어도 웹뷰로 보면 폰트 크기가 확 작아지는 것 때문에 고민하고 있습니다.
탈탈퇴회원
프로필 보기이 회원 글보기이 회원의 댓글보기
 2015-10-19 (월) 14:51:27
결론 : 상위 부모로부터의 상속입니다.
바로 상위나 그 위의 부모의 값이 100 이면
부모의 값에 맞춰서 조절되는게 em 입니다.

폰트 크기는 기기별로 pixel 차이가 있를지 모르나 웹뷰와는 무관하며
em --> px 위의 뎃글 그대로입니다.

원하시는 부분을 px 로 바꾸시는데
모바일의 width 가 있으므로 em 을 추천 드리고
media 로 조절하는 방법이 최적인것으로 알고 있습니다.

http://www.clearboth.org/28_inheritance_and_cascade/
허허정권
프로필 보기이 회원 글보기이 회원의 댓글보기
 2015-10-19 (월) 15:05:22
감사합니다. ^^ 공부 열심히 하겠습니다 ㅎㅎㅎ!!!
hhalf
프로필 보기이 회원 글보기이 회원의 댓글보기
 2015-10-21 (수) 09:02:17
좋은 정보 얻어 갑니다. ^^
허허정권
프로필 보기이 회원 글보기이 회원의 댓글보기
 2015-10-21 (수) 10:18:47
http://webdesign.tutsplus.com/ko/articles/7-css-units-you-might-not-know-about--cms-22573
다른 분께서 이 링크를 남겨 주셨네요 ㅎㅎ
혹시나 같은 고민을 하시는 분을 위해 남겨놓습니다.
댓글을 작성하시려면 로그인이 필요합니다.

디자인

1,855건
태그 필터 (최대 3개) 전체 디자이너톡 포토샵 플래시 기타 일러스트 디자이너팁 폰트문의 저작권상담 디자인시안 외부로그인 게시판 최근게시물 회원가입 회원통합스킨 갤러리 일반 스크랩 로그인 전체검색 달력 폼메일 최신글 접속자 설문조사 쪽지 패스워드찾기 우편번호 디자인 레이아웃 추천사이트
+
제목 글쓴이 날짜 조회
15-10-23 조회 1,794
15-10-23 조회 1,254
15-10-23 조회 1,452
15-10-22 조회 1,315
15-10-22 조회 1,223
15-10-22 조회 1,648
15-10-19 조회 1,103
15-10-19 조회 1,274
15-10-13 조회 1,601
15-10-11 조회 1,543
15-10-09 조회 1,924
15-10-06 조회 1,305
15-09-23 조회 5,214
15-09-23 조회 4,066
15-09-23 조회 3,569
15-09-23 조회 3,329
15-09-16 조회 2,226
15-09-16 조회 1,542
15-09-15 조회 2,030
15-09-15 조회 1,481
15-09-15 조회 1,348
15-09-14 조회 1,840
15-09-10 조회 1,998
15-09-09 조회 1,915
15-09-09 조회 1,522
15-09-02 조회 2,009
15-08-28 조회 2,752
15-08-20 조회 1,714
15-08-18 조회 2,360
15-08-17 조회 2,387
15-08-17 조회 2,300
15-08-13 조회 1,836
15-08-12 조회 1,292
15-08-12 조회 1,892
15-08-12 조회 1,679
15-08-03 조회 2,615
15-08-03 조회 1,848
15-07-31 조회 1,796
15-07-30 조회 1,633
15-07-26 조회 1,499
15-07-23 조회 1,097
15-07-22 조회 1,825
15-07-15 조회 1,571
15-07-14 조회 1,886
15-07-13 조회 1,097
15-07-13 조회 1,265
15-07-12 조회 957
15-07-12 조회 1,930
15-07-07 조회 2,049
15-07-06 조회 1,688
15-07-05 조회 1,500
15-07-03 조회 1,109
15-07-02 조회 3,194
15-07-01 조회 1,203
15-06-29 조회 1,278
15-06-25 조회 3,102
15-06-25 조회 3,083
15-06-22 조회 2,899
15-06-22 조회 1,479
15-06-16 조회 2,139
15-06-15 조회 1,524
15-06-12 조회 1,317
15-06-02 조회 1,791
15-05-29 조회 2,161
15-05-29 조회 1,579
15-05-22 조회 3,083
15-05-21 조회 3,131
15-05-18 조회 3,242
15-05-18 조회 3,198
15-05-06 조회 3,214
15-05-05 조회 2,342
15-05-02 조회 2,378
15-05-01 조회 1,845
15-04-30 조회 2,991
15-04-28 조회 3,271
15-04-24 조회 2,032
15-04-23 조회 1,414
15-04-17 조회 1,948
15-04-06 조회 1,791
15-03-31 조회 3,101
15-03-27 조회 2,056
15-03-26 조회 1,714
15-03-25 조회 3,464
15-03-19 조회 1,474
15-03-18 조회 1,818
15-03-18 조회 4,201
15-03-18 조회 1,303
15-03-16 조회 2,050
15-03-16 조회 2,004
15-03-07 조회 1,787
15-03-01 조회 1,606
15-02-25 조회 1,927
15-02-13 조회 3,170
15-02-11 조회 1,448
15-02-10 조회 2,196
15-02-10 조회 1,504
15-02-09 조회 1,558
15-02-08 조회 2,203
15-02-04 조회 3,180
15-02-03 조회 3,744
글쓰기