pphum โพสต์ 2016-3-14 16:12:04

วิธีทำให้เว็บเราเป็น Responsive

ไปที่ template\ชื่อธีม\common\common.css

แล้ววางโค้ด ทั้งหมดนี่ต่อท้ายครับ บันทึก แล้วอัพเดตแคส

body#space .mn { float: left!important; width: 760px!important; display: inline;margin-left:10px;margin-bottom: 1em;}
body#space .sd { float: right;margin-right:10px; width: 180px; overflow: hidden; _overflow-y: visible; }
body#space .wp { margin: 0 auto; width: 970px; min-width:970px; }
body#space #wp { width: 960px; min-width:960px; }
body#space #hd {width: 948px;min-width: 948px;margin-top: 30px; border-bottom: {HEADERBORDER} solid {SPECIALBORDER}!important; {HEADERBGCODE} }
body#space #hd .wp { padding: 10px 0 0; }
body#space .bm{background: #FFF;zoom: 1;border: 1px solid #CDCDCD;}
body#space .bm_h{padding: 0 10px;height: 31px;border-top: 1px solid #FFF;border-bottom: 1px solid #C2D5E3;background: #F2F2F2;line-height: 31px;white-space: nowrap;overflow: hidden;}
body#space #pcd {padding: 15px 0 15px 0;}
body#space .area {padding: 0 5px;}


.wp { width: 100%; }
        #hd .wp, #wp { min-width: 1094px; }

.ct2 { margin-right: 320px; }
        .ct2 .sd { margin-right: -320px; }
                .ie7 .ct2 .sd { margin-left: 20px; }
                .ie6 .ct2 .sd { padding-left: 20px; position: relative; }
        .ct2 .mn { width: 100%; }

.ct2 #chart, .ct2 #an { margin-right: -320px; }
        .ie6 .ct2 #chart, .ie6 .ct2 #an { position: relative; }

.ct2_a { padding-left: 150px; }
        .ct2_a .appl { margin-left: -150px; }
                .ie6 .ct2_a .appl { position: relative; display: inline; }
        .ct2_a .mn { width: 98%; }
        #nv_userapp .ct2_a .mn, .ct2_a_r .mn { width: 99%; }

.ct3_a { padding: 0 320px 0 160px; }
        .ct3_a .appl { margin-left: -160px; }
                .ie6 .ct3_a .appl, .ie6 .ct3_a .sd { display: inline; }
        .ct3_a .sd { margin-right: -320px; }
        .ct3_a .mn { margin: 0; width: 100%; }

#nv, #mu { border-left: 1px solid {COMMONBORDER}; border-right: 1px solid {COMMONBORDER}; }

#nv { background-repeat: repeat-x; background-position: 0 -33px; }

#mu ul { border-bottom: 1px solid {COMMONBORDER}; background-image: none; background-color: {COMMONBG}; }

.pg_post .ct2_a { margin-left: 0; padding-left: 0; }
        .pg_post .ct2_a .appl { margin-left: 0; background: none; }
.pg_modcp .ct2_a, .pg_announcement .ct2_a { border: none; }
        .pg_modcp .ct2_a .mn, .pg_announcement .ct2_a .mn { margin-right: 0; padding-top: 0; }

.tdats .tdat { width: 20%; }
.tdats .tfxf { width: 79.5%; }
.tdats .tfx, .tdats .tb, .tscr { width: 39.5%; }
        .tscr .tdat, .tscr .tdat th, .tscr .tdat td { width: 99%; }

.widthauto #toptb #diy-tg_menu { margin: -7px 0 0 -1px; }
.widthauto .switchwidth { background-position: 100% -18px; }
.widthauto .switchwidth:hover { background: url({IMGDIR}/switch_width.png) no-repeat 100% -54px; }


@media screen and (max-width:1430px) {
        body { background:#e2e5e9 url({IMGDIR}/a1.gif) fixed;}
        * html body { background-color:#e2e5e9; background-image:none;}
        #page_main {margin:0 auto; width:1200px;}
        #page_main .insite_bg{ min-height:1080px; float:left;width:1200px; padding:0 0 30px 0; background:#fff url({IMGDIR}/bg1.gif) repeat-y 0 0;}
        .effects_box { margin: 0 auto; height:580px; overflow: hidden;}
        .right_hot li{float:left;width:370px!important;}
        .right_hot li a{width:285px!important;}
        .right_hot li em{padding:0 0 0 0!important;}
       
        .box_in3 {height:388px; overflow:hidden;}
        .art_listbox_3, .art_listbox_4{width:50%;}
        * html .art_listbox_3, * html .art_listbox_4{width:50%;}
        *+html .art_listbox_3, *+html .art_listbox_4{width:50%;}
        }
@media screen and (max-width:1590px) {
        .right_hot li{float:left;width:50%;}
        }

@media screen and (max-width:1890px) { .effects_box_in { margin:0 auto; width:1537px;} * html .effects_box_in { margin:0 auto; width:auto;}}
@media screen and (max-width:1640px) { .effects_box_in { margin:0 auto; width:1281px;} * html .effects_box_in { margin:0 auto; width:auto;}}
@media screen and (max-width:1435px) { .effects_box_in { margin:0 auto; width:1025px;} * html .effects_box_in { margin:0 auto; width:auto;}}
@media screen and (max-width:768px) {
html, body{ background-image:none; background-color:transparent; margin:0; padding:0; height:100%; font-size:15px; font-family:Microsoft YaHei, Helvetica, sans-serif; -webkit-text-size-adjust: none;}
h1, h2, h3, h4, h5, h6, p, th, td { font-size: 15px; -webkit-text-size-adjust: none;}
input,select,textarea,button { font-size: 15px; -webkit-text-size-adjust: none; font-family:Microsoft YaHei, Helvetica, sans-serif; }
#scrolltop { visibility: hidden; position: fixed; bottom: 5px; display: block; margin: -30px 0 0 -15px!important; width: 40px; background: #faefe6; border: 1px #e6b38f solid; border-radius: 3px; border-top: 0; cursor: pointer; }
#scrolltop a { background: url({IMGDIR}/scrolltop.png) no-repeat 0 0; border-top: 1px #e6b38f solid!important; }
#pt { display:none;}
.pcht { width: auto !important; }
.pdbts_0 a {width: 40px !important;}
.tl th .someinfobox *{ font-size:12px; color: #96a0b4 !important;}
.tl th .someinfobox em{padding:0 5px 0 0 !important;}
.tl .frm {width: 1px !important; text-indent:-5000px; overflow:hidden;}
.tb .a a, .tb .current a { white-space: nowrap;}
.nfl .f_c { margin: 30px auto!important; padding: 10px!important; width: 90%!important; border: 3px solid {COMMONBG}; background: {WRAPBG}; }
.fwin .rfm, .nfl .f_c .rfm {width: auto;}
.rfm .px {width: 100px!important;}
.rfm th {padding-right: 10px;width: 70px!important;white-space: nowrap;text-align: right;}
.xst { font-size: 15px!important; }

#uhd {padding-top: 0;border: 0;background:transparent; margin:0 auto;}
#uhd .h {padding-left: 0; margin:0 auto;}
#uhd .h p{padding-left: 0; margin:0 auto; width:auto; text-align:center;}
#uhd .avt {display: block;float: none;margin: 0 auto;width:210px;text-align:center;}
#uhd .mt {padding: 10px 0;font-size: 16px;width:210px;text-align:center;margin: 0 auto;display: block;}
#uhd .avt img {padding: 2px;width: 120px;height: 120px;background: #FFF;border: 4px solid;border-color: #f3f4f7;border-radius: 66px;}
#uhd .mn { display:none;}
#uhd .flw_hd {float: none;width: 260px;margin:0 auto;margin-bottom: 0;}
#uhd .flw_hd th, #uhd .flw_hd td{text-align:center!important; padding:0 15px;}
#fastpostform {width: 100%!important;}
.flw_article img{ max-width:100%!important;}

/* 发特殊主题帖 by dfox */
.sinf {width: auto !important;}
.sinf p, .sadd p {padding: 2px 0;height: 30px;line-height: 30px;}
.sinf .px {width: 50% !important;}
.sinf .pxs {width: 20px !important;}
.sadd .px {width: 50px !important;}
.sinf {float: left;padding-right: 0px !important;width: 380px;border-right: 0 !important;}
.sinf h4 {padding: 6px 0;}
.sinf textarea {width: auto !important;height: 80px;}
.sinf a.d {margin-top: 8px;}
.sinf object {vertical-align: middle;display:none;}
.onum {float: left;margin-right: 6px;width: 16px;}
.oinf {width: 270px !important;}
.sinf dl, .sadd dl {overflow: hidden;}
.sinf dl dt, .sadd dl dt {float: left;padding-top: 3px\9;width: 75px;clear: left;}
.sinf dl dd, .sadd dl dd {margin-bottom: 10px;overflow: hidden;}
.sinf dl dd {width:auto !important;}
.sinf span.fb, .sadd span.fb {display: block;float: left;margin-right: 6px;height: 26px;line-height: 26px;white-space: nowrap;}
.sinf dl dd strong {padding: 0 8px;}
.sadd {float: left;margin-left: 10px;width: auto !important;overflow: hidden;}
.sadd dl dd {width: 420px;}
.ct2_a .sadd {width: 360px;}
.ct2_a .sadd dl dd {width: 260px;}
.spl em {float: left;margin-right: 9px;height: 20px;line-height: 20px;}
.spl input {margin: 0 3px 0 0;}
.spimg {margin: 0 10px 0 0;width: 200px;border: 1px solid #AAA;}
.spmp {width: 30px;}
.spmf {width:auto !important;}
.spmf, .spmf3 {overflow: hidden;_height: 1%;}
.spmf label, .spmf3 label {display: block;padding-top: 5px;}
.spmf em {float: left;width: 150px;}
.spmf3 em {float: left;margin-right: 12px;}
.spmf3 .px {margin: 0 !important;width: 72px;}

/** end **/

/*活动、商品*/
.act {}
.act .c { line-height: 28px; font-size: 14px; }
.spvimg { text-align:left; margin:0 auto; padding:0 0 20px 0!important; width:auto!important;background:none !important; border:0 !important;}
.spvimgimg{ max-width:90%!important;width:auto!important; height:auto!important;}
.spvimg em.hot { width: 120px; height: 102px; background-position: 0 -104px; }
.spi { margin-left: 0 !important; clear:both; width:100%; margin:0 auto; float:left;}
.trdc { margin-top: 20px; background: #8e92a0!important;border-radius: 4px; height: 30px; line-height: 30px; color: {LIGHTLINK}; }
/** end **/

.sslct_btn {font-size: 12px;}
.left_menubox{ width:8px;float:left;margin:0;padding:0;position:relative;}
.left_menubox .in{display:none;}
.left_menubox .online_user{ display:block; text-indent:1.2em; background:url({IMGDIR}/a8.png) no-repeat 0 50%;}
.page_contentbox {margin:0 0 0 18px;padding:0 10px 0 0;min-width: inherit;}
#page_main {margin:0 auto; width:auto;}
#page_main .insite_bg{ min-height:1080px; width:100%;margin:0 auto; padding:0 0 30px 0; background:#fff url({IMGDIR}/bg1.gif) repeat-y -64px 0;}
#hd .wp, #wp { min-width:inherit; }
#toptb {min-width: inherit;width: auto;}
#qmenu{display:none;}
#nv1 i, #nv2 i, .top_bgimg {display:none;}
#nv1, #nv2 { height:38px; background:none; clear:both; overflow:hidden; margin-bottom:20px;}

.mobile_on { display: block;}
.mobile_hidden{display:none!important;}

.box_in3 {height: auto; overflow:hidden; padding:20px 0 0 0;}
.art_listbox_3, .art_listbox_4{width:100%; clear:both;border-radius: 6px;}

.effects_box { clear:both; margin: 0 auto; height: auto; overflow: hidden; }
.effects_box_in { margin:0 auto; width:442px;}
.effects_box .img_box {float: left; margin:0 auto; display:inline;width:200px;padding:10px; overflow:hidden;}
.effects_box .box_in{display:block;width:200px;height:265px;border:#e3e8ee 1px solid;overflow:hidden;box-shadow: 2px 2px 2px #e3e8ee;border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px;}

.cbp-spmenu {position: absolute;top:0;left:0;display:block;float:left;width: 150px;background: #fe6400;min-height:960px;}
.cbp-spmenu h3 {color: #ffc49b;font-size: 24px;padding:0 0 0 20px;height:78px;line-height:78px;margin: 0;font-weight: 700;background: #b63300;}
.cbp-spmenu a {display: block;color: #fff;font-size: 16px;font-weight: 400;}
.cbp-spmenu a:hover {background: #fe6400;}
.cbp-spmenu-vertical {width: 150px; display:block;height: 100%;top: 0;z-index: 1000;}
.cbp-spmenu-vertical a {border-bottom: 1px solid #ee4b00;background: #fe6400;padding:12px 8px 12px 1em;display: block;height:25px;white-space: nowrap; overflow: hidden;text-overflow: ellipsis;line-height:25px;}
.cbp-spmenu-left {left: -150px;position:relative;}
.cbp-spmenu-left.cbp-spmenu-open {left: 0px;}
.cbp-spmenu-right.cbp-spmenu-open {right: 0px;}
.cbp-spmenu-push-toright {left: 150px;}
.cbp-spmenu, .cbp-spmenu-push {-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;transition: all 0.3s ease;}
.main {top:78px;left:150px;z-index: 1001;}
.main > section {max-width: 25px;margin:0;}
.main > section button {border: none;background: #fe6400 url({IMGDIR}/a2.png) no-repeat 4px 50%;padding: 0;display: block;width: 25px;height:50px;cursor: pointer;margin: 0;border-radius: 0 25px 25px 0;position:fixed;top:82px;left:0;}
.main > section button.active {border: none;background: transparent url({IMGDIR}/a3.png) no-repeat 100% 50%;padding: 0;display: block;width: 135px;height:50px;cursor: pointer;margin: 0;border-radius: 0 0 0 0;position: absolute;top:16px;left:0;}
.main > section button a {border: none;background-color:transparent;width: 25px;height:50px;display:block;float:left;}
.main > section button a:hover {border: none;background:none;}
.responsive-menu, .responsive-menu select {display: block;clear:both;}
.responsive-menu {text-align: center;}
.responsive-menu select {float: left;display: block;width: 100%;margin: 0;-webkit-appearance: button;-webkit-padding-end: 30px;-webkit-padding-start: 40px;-webkit-user-select: none;border: 1px solid #e3e8ee;border-top: 3px solid #e3e8ee;color: #4b4d54;font-size: 15px;overflow: hidden;padding:5px 20px 5px 20px;cursor: pointer;outline: none;background:#f4f5f7 url({IMGDIR}/a20.gif) no-repeat 100% 50%;border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px;}
.responsive-menu select option{line-height:30px;height:30px;margin:5px auto;}
.responsive-menu #mainnav {display:none;}
.top_imgbottums {float:right;text-align:right;padding:5px 0 0 0;}
.top_imgbottums img{height:34px;width:34px;margin:0;}
.topuserbox h4 img{float:left; width:125px;}
#myprompt_menu { position:fixed; left:-5000px;}
.top_usermessages_a { font-size:12px; font-weight:700;-webkit-text-size-adjust: none; color:#fe6400; display: block; line-height:28px; height:28px;}
.top_usermessages_a img{vertical-align:middle;}

.in_list{clear:both; display:block; margin:0 auto;text-align:left; float:left; padding-bottom:6px;}
.in_list a{ float:left; display:block; height:24px; line-height:24px;font-size:14px;font-weight:700;color:#fe6400;padding:0 10px; background:#eceff1;border-radius:12px; margin:0 4px 4px 0;white-space: nowrap;}
.in_list a:hover{text-decoration:none;color:#fff; background:#a3a6ae;}

.left_hot{ float:left; width:auto; clear:both; margin:0 auto;}
.right_hot{ margin:0; clear:both; float:left; padding-bottom:10px;}
.right_hot_in{ margin:0; float:left; display:block;height: auto; overflow:;padding:0;}
.right_hot li{width:100%!important; height:24px; overflow:hidden; float: left;}
.right_hot li a{width:auto!important;}

.nTab {margin: 0 0 0 0; float:left;overflow:;width:auto;}
.nTab .TabTitle { display:none;}
.nTab .TabContent {width:auto;float:left; margin:0 auto;padding:0;height:auto;}
.nTab .TabContent .text {float:left;width:auto;}
.nTab .TabContent .text h1 {float:left;width:auto; overflow:hidden;}
.nTab .TabContent .text h1 a {float:left;display:block;font-size:16px;width:auto;height: auto;line-height:24px; padding:10px 0; overflow:inherit;overflow:;color:#060606;}
.nTab .TabContent .text .newsbox1 {clear:both;width:auto;float:left;}
.nTab .TabContent .text .newsbox1 p {color:#808ba1;line-height:24px;height:auto; float:none; width:auto; padding:0 0 10px 0; border-bottom:#e3e8ee 1px solid;margin-bottom:10px;}
.nTab .TabContent .text .newsbox1 p a { clear:both; display:block; float:none; margin:0 auto; text-align:center; overflow:hidden;}
.nTab .TabContent .text .newsbox1 p a img{ clear:both; display:block; float:none;margin:8px 0 15px 0;min-width:290px;height: auto;border-radius: 4px;}

.box_in1{margin:0 auto; clear:both;width:auto;overflow:hidden;}
.box_in1 .in{width: inherit;padding:0;margin:0 auto;float: none;}
.box_in1 .box{width:auto; clear:both;padding:0 0 0 0;margin:0 auto; display:block; float:none;text-align:center;}
.box_in1 .box1{width:auto; clear:both;padding:0 0 0 0;margin:0 auto; display:block; float:none;text-align:center;}

.ct2 {margin-right: 0;}
.ct2 .sd {display:none;}
.ct2 .mn {width: 100%;}
.art_listbox_1, .art_listbox_2 {width:100%;}
.ct3_a {padding: 0 0 0 0;}
.ct3_a .appl {margin-left: 0;}
.ct3_a .sd {display:none;}
.ct3_a .mn {margin: 0;width: 100%;}

.article_title {clear:both;margin:0 auto;border-bottom:#e3e8ee 4px solid;border-top:#e3e8ee 1px solid;height: auto;line-height:26px; padding:10px 0;color:#fe6400;font-family: Microsoft YaHei, Segoe UI, Tahoma, Arial;font-size:24px;}
.article_title_style_in{text-align:center;}
#article_content { border-top:0; border-top:#f3f5f8 0px solid;}
.vw .d img {width: 100%;}
.yuan_img img{padding: 2px;width: 120px;height: 120px;background: #FFF;border: 4px solid;border-color: #f3f4f7;border-radius: 66px;}
.tedt { width: 99%; border: 1px solid; border-color: #cfd4db;border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; }
.tedt textarea, .tedt .area{ background: transparent;}
.ptn .pn {vertical-align: middle;overflow: hidden;margin: 0 auto;padding:0;height: 40px;line-height:40px;width:99%;color:#a50000;font-size:18px;border:#ffb27e 1px solid;background: #fec7a2 url({IMGDIR}/a23.gif) repeat-x 0 0;cursor: pointer;border-radius: 4px;-webkit-border-radius: 4px;-moz-border-radius: 4px;}
.ptn .pn strong{ font-weight:400;}
.ptn .pn:hover, .ptn .pn:active{background: #fec7a2 url({IMGDIR}/a23.gif) repeat-x 0 -50px;}

td.num, td.by, td.o { width: 1px!important; overflow:hidden!important; text-indent:-9000px!important;}
td.num cite, td.by cite, td.num em, td.by em, { display:none!important;}
.tl th, .tl td.fn {padding-right: 0!important;zoom: 1;}
.rightbox { display:none;}
.v_leftbox {margin:0 0 0 0; padding:0 0 0 0;}
.pct img{ max-width:100%;}
#vfastpost #vf_m input{ border:0!important; padding-left:0!important; padding-right:0!important; background:none!important; width:90%!important;}
#p_btn { display:none;}
.attach_nopermission {width: auto!important;}
.psth {width: 200px!important; }
#newspecial_menu a { display: block; padding: 3px 0 3px 30px; font-size:14px;white-space: nowrap; }
.ct_vw_mn { float: left; width: 100%!important; }

.mlp li {width: 135px!important;}
.ml li {float: left;padding: 5px 0!important;text-align: center;overflow: hidden;width: 125px!important;}

.photo_pic { width:100%!important; }
.photo_pic img{ width:auto; max-width:auto!important; }

#moodfm{ width: 100%!important; }
#moodfm table{ width: 100%!important; }
#moodfm textarea { width: 100%!important; height: 48px; padding:4px; border: 1px solid; border-color:#cfd4db; overflow-y: auto;border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; }
.mi .moodfm_input { width: auto!important; height: 58px; background: {COMMONBORDER} url({IMGDIR}/mood_input.png) no-repeat 100% 0; }
.moodfm_btn { width:68px; background: url({IMGDIR}/mood_input_btn.png) no-repeat 100% 0!important;}
.cmt {margin: 10px 0 10px 0!important;}

.ct2_a {padding-left: 0;}
.ct2_a, .ct3_a {border: 0;background: none;}
.ct2_a .appl {display:block;clear:both;margin:0 auto;width:100%;}
.appl {overflow: visible;padding: 6px 0 1px 0;margin:0 auto;float:left;border-bottom:#e3e8ee 1px solid;}
.ct2_a .mn {display: block;margin:0 auto;padding-top: 0;width: 100%;float: none;}
.my_flw_stats {display:none;}
.tbn {margin: 0;}
.tbn .mt {padding: 5px 0;}
.bbda {border-bottom:#e3e8ee 4px solid;margin-bottom:10px;}
.tbn li {margin: 0 5px 5px 0;height: 22px;line-height:22px;border-bottom: 0;float:left;display:block;}
.appl li {display: block;height: 28px;line-height: 28px;white-space: nowrap;word-wrap: normal;font-size: 14px;text-overflow: ellipsis;overflow: hidden;}
.tbn li.a {margin: 0 5px 5px 0;padding: 0;border-top:0;border-bottom-style: none;background:transparent;}
.tbn li.a a {display: block;float:left;height: 22px;line-height:22px;background:#8c8e98;padding:0 10px;color:#fff;}
.tbn ul a {display: block;float:left;height: 22px;line-height:22px;background:#f0f1f5;padding:0 10px;border-radius: 4px;}
#flw_header {padding:10px 0!important;}
.pg_space .bm_c {padding: 10px 0!important;}
.ct1 {border: 0;border-top: none;}
.tl table th {width: 100%;}
.ttp li {float: left;display:block;margin: 0 5px 5px 0;padding: 0!important;border: 0!important;font-size:14px!important;}
.ttp li a {border-radius: 4px;float: left;display:block;margin:0;padding: 0 10px!important;height: 22px!important;line-height:22px!important;border: 0!important;background: #f0f1f5!important;white-space: nowrap;font-weight:400;font-size:14px!important;}
.ttp li.a a {background: transparent!important;color:#fff!important;}
.ttp li.a {background: #8c8e98!important;border-radius: 4px;}
.notice_pm, .notice_mypost, .notice_interactive, .notice_system, .notice_manage, .notice_app { display:none;}
.dopt .px{float: left;width:50%!important;}
.tfm th {padding-top: 9px;padding-right: 5px;width: 10px;white-space: nowrap;}
.tfm .pt, .tfm .px {margin-right: 3px;width: auto!important;}
.dt th {white-space: nowrap; width:auto!important;}
/*外加*/
.t_f * { font-size:15px!important; font-style:normal!important;}
.sign { display:none;}
#wechat_float_qrcode, #jz52top { display:none;}
#g_commend .xld dt{ display:none;}
#g_commend .xld dd.xg1{ display:none;}
#f_pst .pbt .px { width:96%!important;}
.un_selector input {width:96%!important;}
.pmform .tedt {width:90%!important;}

#scform_srchtxt { width:150px!important;}
#scform_tb a { margin: 0 12px 0 3px!important;}
.slst { width: inherit!important; }
#pic_v_big { clear:both; width: auto; margin:0 auto; overflow:hidden; }
#pic_v_big img{ width:auto; margin:0 auto; max-width:100%!important;}
.focus { display:none;}


}

@media screen and (max-width:470px) {
.effects_box { clear:both; margin: 0 auto; height:auto; overflow: hidden; }
.effects_box_in { margin:0 auto; width:256px;}
.effects_box .img_box {float: left; margin:0 auto; clear:both;display:inline;width:256px;padding:10px 8px 10px 8px; overflow:hidden;}
.effects_box .box_in{display:block;width:240px;height:265px;border:#e3e8ee 1px solid;overflow:hidden;box-shadow: 2px 2px 2px #e3e8ee;border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px;}
}



อย่าถามหาบัค เพราะมีแน่นอน มีเยอะด้วย 555 เอาไปลองไปปรับแต่งดูละกันนะครับ

beerqazasa โพสต์ 2016-3-14 17:31:32

อย่าลืมโค้ดนี้
<meta name="viewport" content="width=device-width, initial-scale=1">
ใส่ใน tag head

submark โพสต์ 2016-3-14 19:55:44

โค้ดนี้ใช้ไม่ได้กับทุกแม่แบบนะครับ
ผมลองแล้ว
BEFORE
https://i.imgy.org/g3ryzB2L.png
AFTER
https://i.imgy.org/n2bYxZJP.png

pphum โพสต์ 2016-3-14 23:30:47

beerqazasa ตอบกลับเมื่อ 2016-3-14 17:31
อย่าลืมโค้ดนี้

ใส่ใน tag head

โอ้ลืมไปเลย ใช่ๆ

pphum โพสต์ 2016-3-14 23:32:04

submark ตอบกลับเมื่อ 2016-3-14 19:55
โค้ดนี้ใช้ไม่ได้กับทุกแม่แบบนะครับ
ผมลองแล้ว
BEFORE


<meta name="viewport" content="width=device-width, initial-scale=1"> ใส่ตัวนี้ในแท็ค head ด้วยนะครับ

submark โพสต์ 2016-3-15 00:58:02

pphum ตอบกลับเมื่อ 2016-3-14 23:32
ใส่ตัวนี้ในแท็ค head ด้วยนะครับ

ใส่ไปเรียบร้อยตั้งแต่ครั้งแรกแล้วครับ เป็นอย่างที่โพสต์ไป

kingkitb โพสต์ 2016-3-15 07:17:37

Discuz ปกติไม่ได้ทำมาเพื่อ Responsive นะ
การแสดงผลทั้งเว็บจะล้นออกจากขนาดจออยู่ดี

เพิ่มเนื้อหา (2016-3-15 07:17):
ไม่งั้นต้องแก้ส่วนอื่นด้วย

pphum โพสต์ 2016-3-15 09:37:52

submark ตอบกลับเมื่อ 2016-3-15 00:58
ใส่ไปเรียบร้อยตั้งแต่ครั้งแรกแล้วครับ เป็นอย่างที่โพสต์ไป

ลองกับสกินดีฟอล ได้ไหมครับ

notkii โพสต์ 2016-3-16 11:34:31

มันทำได้นะครับ แต่ว่าถ้าจะทำจริงๆอะบอกแค่นี้ไม่พอหรอกครับ sm954dz

TuMTheTasTo โพสต์ 2016-4-23 06:45:10

submark ตอบกลับเมื่อ 2016-3-14 19:55
โค้ดนี้ใช้ไม่ได้กับทุกแม่แบบนะครับ
ผมลองแล้ว
BEFORE


อยากได้แม่แบบ ตัวนี้ จัง ขอ ได้ไหม ครับ ^)^
หน้า: [1]
ดูในรูปแบบกติ: วิธีทำให้เว็บเราเป็น Responsive