묻고답하기
[간단한 css 문의] 모바일 본문 폰트 사이즈 조정
2013.02.25 13:38
css 문외한이라 대체 무엇을 건드려야 모바일 본문 페이지에 폰트 사이즈를 크게 할 수 있는지 도저히 알 방법이 없어서
여기에다 문의를 드립니다.
모바일 본문 목록 폰트와 본문 페이지의 글씨를 14px 정도로 크게 하고 싶습니다. 지금 보이는 폰트는 너무 작아서 보는데 눈이 아프네요.
본문 목록 본문 페이지
제가 사용하고 있는 모바일스킨은 default_ajax 입니다. css 파일 내용이 아래와 같습니다.
어디를 바꾸면 모바일페이지의 본문 글씨가 커 질까요?
아시는 분 답변 좀 부탁드립니다. 제가 가진 포인트 전부(10포인트밖에 안되지만)를 드릴게요. ㅠㅠ
@charset "utf-8";
/* Mobile XE (/modules/board/m.skins/default) */
body{margin:0;background:#fff;color:#000;word-wrap:break-word}
body,input,textarea,select,button,table{font-family:Tahoma,Geneva,sans-serif}
img{border:0}
em{font-style:normal}
form{margin:0;padding:0}
fieldset{margin:0;padding:0;border:0}
textarea{resize:vertical}
input[type=checkbox],
input[type=radio]{width:13px;height:13px;margin:0;padding:0}
/* Common */
.fl{float:left}
.fr{float:right}
/* Background */
.rp li li,
.rp .answer,
.rp .btn,
.hx .write{background-image:url(../img/mx.png);background-repeat:no-repeat}
/* Body */
.bd{background:#f8f8f8;padding:1px 0}
.co{margin:10px;line-height:1.4;font-size:14px;color:#333}
.co:after{content:"";display:block;clear:both;*zoom:1}
/* Hx */
.hx{position:relative;border-bottom:1px solid #ccc8be;padding:8px 10px;margin:0}
.hx:after{content:"";margin:0 -10px;position:relative;top:10px;display:block;clear:both;height:1px;background:#fff}
.hx.h2{background:#e5e5e5;text-shadow:1px 1px 0 #fff;padding-right:40px}
.hx.h2 em{font-size:12px;color:#6352d2}
.hx.h3{background:#868686;color:#fff}
.hx.h3 em{font-size:12px}
.hx h2, .hx h3{margin:0 10px 0 0;display:inline}
.hx h2{font-size:16px;line-height:1.4}
.hx h3{font-size:14px}
.hx a{color:#000}
.hx .ex{font-size:12px}
.hx .tg{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;padding:0;overflow:visible;border:0;cursor:pointer;opacity:0;filter:alpha(opacity=0);background:none}
.hx .ca{font-size:12px;text-decoration:underline;color:#333}
.hx .ca:after{content:"";display:inline-block;position:relative;left:4px;width:0;height:0;border:4px solid;border-color:transparent;border-left-color:#8d7de1;margin:0 -8px 0 0}
.hx .write{position:absolute;top:8px;right:10px;background-position:0 0;display:inline-block;width:28px;height:27px;font-size:0;overflow:hidden;text-indent:-28px}
/* Global Navigation */
.gn{margin:0;padding:0;list-style:none;background:#d3d1cc;text-shadow:1px 1px 0 #fff}
.gn li{background:#c3c3c3;border:1px solid #a3a09a;border-left:0;border-right:0;margin:0 0 -1px 0}
.gn li li{background:#f8f8f8;border:1px solid #c9c9c9;border-left:0;border-right:0}
.gn li li li{background:#e8e8e8}
.gn ul{margin:0 0 -1px 0;padding:0;list-style:none}
.gn a{position:relative;text-decoration:none;display:block;padding:10px;font-size:16px}
.gn li a{color:#333}
.gn li a:after{position:absolute;top:7px;right:10px;content:"›";color:#888;font-size:18px;font-weight:bold;font-family:Verdana, Geneva, sans-serif}
.gn li li a:before{content:"";display:inline-block;width:6px;height:6px;border:1px dotted #666;border-top:0;border-right:0;margin:0 4px 0 0;vertical-align:top}
.gn li li a{padding-left:15px}
.gn li li li a{padding-left:30px}
.gn li li li li a{padding-left:45px}
.gn li li li li li a{padding-left:60px}
.gn em{color:#6352d2;font-size:12px}
/* List */
.lt{margin:0;padding:0;list-style:none;background:#f8f8f8;font-size:14px}
.lt li{border-bottom:1px solid #ccc8be}
.lt a{display:block;text-decoration:none;color:#000;padding:10px}
.lt .notice{display:inline-block;background:#a06acd;font-weight:bold;color:#fff;font-size:12px;padding:1px;border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px}
.lt .title{display:block;margin:0 0 5px 0}
.lt .title strong{font-size:14px;font-weight:bold}
.lt .title em{font-size:12px;color:#333;color:#6352d2}
.lt .auth{display:block;font-size:12px}
.lt .auth .time{padding:0 5px;border-left:1px solid #bfbfbf}
/* Toggle Open */
.tgo{display:none;background:#f8f8f8;color:#333;margin:0;padding:0;list-style:none;font-size:14px;color:#333}
.tgo.open{display:block}
.file{margin:0;padding:0;list-style:none}
.file li{border-top:1px solid #c9c9c9;border-bottom:1px solid #c9c9c9;margin:0 0 -1px 0}
.file a{text-decoration:none;display:block;padding:10px 0 10px 10px;color:#333}
.file .size{font-size:12px;border-left:1px solid #bfbfbf;margin:0 5px;padding:0 10px;color:#666}
.rp ul{margin:10px 0 -11px -10px;padding:0;list-style:none}
.rp li{border-top:1px solid #c9c9c9;border-bottom:1px solid #c9c9c9;padding:10px 0 10px 10px;margin:0 0 -1px 0}
.rp .xe_content, .rp p{margin:0 0 5px 0}
.rp ul ul{margin-left:-25px}
.rp ul ul ul{margin-left:-40px}
.rp ul ul ul ul{margin-left:-55px}
.rp ul ul ul ul ul{margin-left:-70px}
.rp ul ul ul ul ul ul{margin-left:-85px}
.rp li li,
.rp .answer{padding-left:25px;background-position:10px -145px}
.rp li li li{padding-left:40px;background-position:25px -145px}
.rp li li li li{padding-left:55px;background-position:40px -145px}
.rp li li li li li{padding-left:70px;background-position:55px -145px}
.rp li li li li li li{padding-left:85px;background-position:70px -145px}
.rp .btn{display:inline-block;width:15px;height:15px;overflow:hidden;vertical-align:middle;text-indent:15px}
.rp .btn.ed{background-position:0 -32px}
.rp .btn.de{background-position:-15px -32px}
.rp .btn.re{background-position:-30px -32px}
.rp .auth{font-size:12px}
.rp .auth .time{padding:0 5px;border-left:1px solid #bfbfbf}
/* Form Field */
.origin{padding:10px 0;margin:0 10px;font-size:14px}
.ff{margin:0;padding:10px 0}
.ff ul{margin:0 10px 10px 10px;padding:10px 0 0 0;list-style:none}
.ff li{margin:0 0 5px 0;padding:0}
.ff label{margin-right:10px}
.ff label+input[type=text],
.ff label+input[type=password],
.ff label+textarea,
.ff label+select{display:block;width:96%;font-size:14px;margin:0 0 5px 0}
.ff label+input[type=text],
.ff label+input[type=password],
.ff label+textarea{padding:5px}
/* Button Area */
.bna{text-align:center;padding:10px;margin:10px 0;}
.bna:after{content:"";display:block;clear:both}
.bn{display:inline-block;line-height:26px !important;padding:0 10px;font-size:12px;font-weight:bold;border:1px solid;text-decoration:none;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;cursor:pointer;vertical-align:middle}
.bn[type=submit],
.bn[type=button]{height:28px}
.bn[href]{height:26px}
.bn.dark{border-color:#666;background:#777 -webkit-gradient(linear,0% 0%,0% 100%,from(#7e7c78),to(#5c5b58));background:#777 -moz-linear-gradient(top,#7e7c78,#5c5b58);background-color:#777;color:#fff;box-shadow:0 0 1px #fff inset;-moz-box-shadow:0 0 1px #fff inset;-webkit-box-shadow:0 0 1px #fff inset}
.bn.white{border-color:#b5b5b5;background:#1b1b1b -webkit-gradient(linear,0% 0%,0% 100%,from(#fff),to(#f6f6f6),color-stop(0.5,#f0f0f0),color-stop(0.5,#e4e4e4));background:#1b1b1b -moz-linear-gradient(top,#fff,#e4e4e4);background-color:#1b1b1b;color:#000}
/* Pagination */
.pn{font-size:12px;text-align:center;background:#f2f0ec;padding:15px 0;border-top:1px solid #fff}
.pn a{color:#333;text-decoration:none}
.pn strong{margin:0 10px}
.pn .prev:before{content:"";display:inline-block;width:0;height:0;margin:0 4px 0 0;border:4px solid;border-color:transparent;border-right-color:#999}
.pn .next:after{content:"";display:inline-block;width:0;height:0;margin:0 0 0 4px;border:4px solid;border-color:transparent;border-left-color:#999}
/* Search */
.sh{border:1px solid #bfbfbf;border-left:0;border-right:0;background:#e8e8e8;padding:10px;text-align:center}
.sh *{vertical-align:top}
.sh select{width:80px;font-size:14px;margin:0 0 5px 0}
.sh input[type=text]{width:160px;margin:0;font-size:14px;padding:5px}
.sh .shbn{width:28px;height:28px;border:1px solid #666;background:#777 url(../img/mx.png) no-repeat 5px -60px;box-shadow:0 0 1px #fff inset;-moz-box-shadow:0 0 1px #fff inset;-webkit-box-shadow:0 0 1px #fff inset;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;cursor:pointer}
/*div fix */
.abn{float:right; padding:5px;}
.abn.dark{border-color:#666;background:#777 -webkit-gradient(linear,0% 0%,0% 100%,from(#7e7c78),to(#5c5b58));background:#777 -moz-linear-gradient(top,#7e7c78,#5c5b58);background-color:#777;color:#fff;box-shadow:0 0 1px #fff inset;-moz-box-shadow:0 0 1px #fff inset;-webkit-box-shadow:0 0 1px #fff inset}
.fix{position:relative;margin:0; padding:5px;}
.fix p{padding:10px 0px 0px 0px; margin:0px; font-size: 12px;}
.clear{clar:booth;}
/*file upload*/
#files a{text-decoration:none;}
ul#files{ position:relative; float:left; width:100%;list-style:none; padding:0; margin:0; }
ul#files li{ margin-bottom:2px; width:100%; float:left; }
ul#files li img{ position:relative; float:left; max-width:80px; max-height:80px; padding:5px 10px 5px 10px; }
ul#files li .filename{ position:relative; float:left; }
.success{ background:#f4f4f4; border:1px solid #ccc8be; }
.error{ background:#f0c6c3; border:1px solid #cc6622; }
fieldset { background: #FFFFFF; border-bottom:1px solid #ccc8be; font-size: 12px;
width: 100%; height:100%; padding:0px;margin:0px;}
댓글 1
-
송동우
2013.02.25 13:51
-
소근소근
2013.02.25 14:09
감사합니다. 적어주신대로 반영했더니, 모바일 본문목록과 본문 세부페이지 글씨가 커졌습니다!!! 시원시원하게 볼 수 있습니다. 감사합니다.
.lt{margin:0;padding:0;list-style:none;background:#f8f8f8;font-size:14px}
이 부분에서 14를 원하는 대로 수정해보세요
본문은
div.xe_content {font-size:18px;}
이것 한 줄 추가해보세요.....