보시는 바와 같이 같은 페이지를 표시하는데 폰트의 크기가 다르게 나오는군요...
혹시나 같은 현상을 겪어 보신 분이나 고민중이신 분
해결하기 위한 방법이 뭐가 있을까요 ㅠ
 |
|
왼쪽 이미지는 모바일 크롬에서 확인한 것이고요
오른쪽 이미지는 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개
상속과 절대 차이입니다.
body에 16px로 폰트 크기를 정해놓았는데요,
같은 1em이어도 웹뷰로 보면 폰트 크기가 확 작아지는 것 때문에 고민하고 있습니다.
바로 상위나 그 위의 부모의 값이 100 이면
부모의 값에 맞춰서 조절되는게 em 입니다.
폰트 크기는 기기별로 pixel 차이가 있를지 모르나 웹뷰와는 무관하며
em --> px 위의 뎃글 그대로입니다.
원하시는 부분을 px 로 바꾸시는데
모바일의 width 가 있으므로 em 을 추천 드리고
media 로 조절하는 방법이 최적인것으로 알고 있습니다.
http://www.clearboth.org/28_inheritance_and_cascade/
다른 분께서 이 링크를 남겨 주셨네요 ㅎㅎ
혹시나 같은 고민을 하시는 분을 위해 남겨놓습니다.
게시판 목록
디자인
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 1866 | 9년 전 | 81 | ||
| 1865 | 9년 전 | 120 | ||
| 1864 | 9년 전 | 138 | ||
| 1863 | 9년 전 | 112 | ||
| 1862 |
크레용웍스
|
9년 전 | 341 | |
| 1861 | 9년 전 | 258 | ||
| 1860 | 9년 전 | 203 | ||
| 1859 | 9년 전 | 221 | ||
| 1858 |
 nanati |
9년 전 | 546 | |
| 1857 | 9년 전 | 355 | ||
| 1856 | 9년 전 | 237 | ||
| 1855 | 9년 전 | 246 | ||
| 1854 | 9년 전 | 485 | ||
| 1853 | 9년 전 | 305 | ||
| 1852 |
 weblife |
9년 전 | 483 | |
| 1851 | 9년 전 | 256 | ||
| 1850 | 9년 전 | 237 | ||
| 1849 | 9년 전 | 246 | ||
| 1848 | 9년 전 | 184 | ||
| 1847 | 9년 전 | 175 | ||
| 1846 | 9년 전 | 209 | ||
| 1845 | 9년 전 | 427 | ||
| 1844 | 9년 전 | 349 | ||
| 1843 | 9년 전 | 471 | ||
| 1842 | 9년 전 | 404 | ||
| 1841 | 9년 전 | 280 | ||
| 1840 | 9년 전 | 594 | ||
| 1839 | 9년 전 | 670 | ||
| 1838 | 9년 전 | 468 | ||
| 1837 | 9년 전 | 356 | ||
| 1836 | 9년 전 | 452 | ||
| 1835 | 9년 전 | 795 | ||
| 1834 | 9년 전 | 760 | ||
| 1833 | 9년 전 | 515 | ||
| 1832 | 9년 전 | 562 | ||
| 1831 | 9년 전 | 592 | ||
| 1830 | 9년 전 | 657 | ||
| 1829 | 9년 전 | 588 | ||
| 1828 | 9년 전 | 771 | ||
| 1827 | 9년 전 | 651 | ||
| 1826 | 9년 전 | 414 | ||
| 1825 |
 apfhd |
9년 전 | 618 | |
| 1824 | 9년 전 | 424 | ||
| 1823 | 9년 전 | 1183 | ||
| 1822 | 9년 전 | 934 | ||
| 1821 | 9년 전 | 878 | ||
| 1820 | 9년 전 | 936 | ||
| 1819 |
 Net디자인 |
9년 전 | 469 | |
| 1818 | 9년 전 | 568 | ||
| 1817 |
아쿠아틴티드
|
9년 전 | 551 | |
| 1816 |
nanati |
9년 전 | 940 | |
| 1815 |
핫디자인1
|
9년 전 | 1047 | |
| 1814 | 9년 전 | 515 | ||
| 1813 |
핫디자인1
|
9년 전 | 632 | |
| 1812 |
핫디자인1
|
9년 전 | 823 | |
| 1811 |
nanati |
9년 전 | 894 | |
| 1810 | 9년 전 | 670 | ||
| 1809 | 9년 전 | 784 | ||
| 1808 | 9년 전 | 814 | ||
| 1807 | 9년 전 | 657 | ||
| 1806 |
jakeeeeel
|
9년 전 | 599 | |
| 1805 | 9년 전 | 1483 | ||
| 1804 | 9년 전 | 828 | ||
| 1803 | 9년 전 | 828 | ||
| 1802 | 9년 전 | 1071 | ||
| 1801 |
seul194
|
9년 전 | 757 | |
| 1800 |
nanati |
9년 전 | 1020 | |
| 1799 | 9년 전 | 770 | ||
| 1798 |
nanati |
9년 전 | 1151 | |
| 1797 | 9년 전 | 1284 | ||
| 1796 |
brucelee1973
|
9년 전 | 2512 | |
| 1795 | 9년 전 | 717 | ||
| 1794 |
nanati |
9년 전 | 686 | |
| 1793 |
프로그래머7
|
9년 전 | 576 | |
| 1792 | 9년 전 | 563 | ||
| 1791 |
weblife |
9년 전 | 1560 | |
| 1790 |
ssir1159
|
9년 전 | 1251 | |
| 1789 | 9년 전 | 1061 | ||
| 1788 |
프로그래머7
|
9년 전 | 778 | |
| 1787 | 9년 전 | 531 | ||
| 1786 | 9년 전 | 635 | ||
| 1785 |
 booly |
9년 전 | 679 | |
| 1784 | 9년 전 | 766 | ||
| 1783 | 9년 전 | 619 | ||
| 1782 | 9년 전 | 398 | ||
| 1781 |
씨에이치넷
|
9년 전 | 1597 | |
| 1780 | 9년 전 | 855 | ||
| 1779 | 9년 전 | 900 | ||
| 1778 |
 별을따는소년 |
9년 전 | 1256 | |
| 1777 | 9년 전 | 656 | ||
| 1776 | 9년 전 | 1022 | ||
| 1775 | 9년 전 | 459 | ||
| 1774 | 10년 전 | 720 | ||
| 1773 |
 ABC디자인 |
10년 전 | 1459 | |
| 1772 | 10년 전 | 866 | ||
| 1771 | 10년 전 | 839 | ||
| 1770 |
ABC디자인 |
10년 전 | 1711 | |
| 1769 |
ABC디자인 |
10년 전 | 1446 | |
| 1768 |
헤이하치대머리
|
10년 전 | 747 | |
| 1767 |
씨에이치넷
|
10년 전 | 1659 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기