Rumah > hujung hadapan web > html tutorial > 一个网页在浏览器里不是全屏 在手机端是全屏_html/css_WEB-ITnose

一个网页在浏览器里不是全屏 在手机端是全屏_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
Lepaskan: 2016-06-24 11:38:31
asal
1297 orang telah melayarinya

如何使一个网页在浏览器里不是全屏 在手机端是全屏
nbsp;html>













 一个网页在浏览器里不是全屏 在手机端是全屏_html/css_WEB-ITnose





  • 一个网页在浏览器里不是全屏 在手机端是全屏_html/css_WEB-ITnose
    婚姻家庭

  • 一个网页在浏览器里不是全屏 在手机端是全屏_html/css_WEB-ITnose
    财产纠纷

  • 一个网页在浏览器里不是全屏 在手机端是全屏_html/css_WEB-ITnose
    交通事故

  • 一个网页在浏览器里不是全屏 在手机端是全屏_html/css_WEB-ITnose
    医疗纠纷

  • 一个网页在浏览器里不是全屏 在手机端是全屏_html/css_WEB-ITnose
    刑事辩护

  • 一个网页在浏览器里不是全屏 在手机端是全屏_html/css_WEB-ITnose
    劳动人事

  • 一个网页在浏览器里不是全屏 在手机端是全屏_html/css_WEB-ITnose
    公司事务

  • 一个网页在浏览器里不是全屏 在手机端是全屏_html/css_WEB-ITnose
     更多






回复讨论(解决方案)

看看 media query 吧,挺简单的,就是麻烦。你可以参考下:

@media only screen and (max-width: 959px) {    .top-fix .menu-control {position: absolute; top: 13px; right: 18px; display: block; text-align: center; }    .top-fix .menu-control a {display: block; border: none; padding: 0; background-color: transparent; cursor: pointer; width: 21px; height: 20px; color: rgba(0, 0, 0, 0); line-height: 200px; overflow: hidden; background-image: url(../images/menu_control.png); background-repeat: no-repeat; }    .top-fix .menu-control-h a {background-image: url(../images/menu_control_h.png); }    .header {display: none; position: absolute; top: 50px; left: 0; background: #333; padding-top: 12px; }    .menu-menumain {margin: 0; }    .menu-menumain .menumain-item {margin: 0; width: 100%; border-bottom: 1px solid #444; }    .menu-menumain .menumain-item a {text-align: left; display: inline-block; margin-left: 20px; }    .menumain-item .sub-indicator{display: none; }    .sub-menu {display: block; position: static; overflow: hidden; background-color: #212121; padding-left: 48px; }    .sub-menu .submenu-item {float: left; }    .top-fix .container .top-fix-wrap {position: relative; margin: 0 auto; }    .top-fix .header,     .top-fix .container {width: 100%!important; }}@media only screen and (max-width: 959px) and (min-width: 630px) {    .top-fix .container .top-fix-wrap {width: 650px!important; }    .container, .list-wrap { width: 630px; } }@media only screen and (max-width: 629px) and (min-width: 479px) {    .container, #homecontent {width: 385px; }    .container .one-third.column,    .container .one-third.column .post {width: 385px; }    .one-third a img.attachment-thumbnail {margin-left: 0; }}@media only screen and (max-width: 479px) and (min-width: 385px) {    .container, #homecontent {width: 100%; }    .container .one-third.column,     .container .one-third.column .post {width: 100%; }    /*.one-third a img.attachment-thumbnail {height: 220px; width: 100%; margin-left: 0; }*/    .one-third  .img-wrap { display: block; height: 220px; overflow: hidden;}    .one-third a img.attachment-thumbnail {height: auto; width: 100%; margin-left: 0; }}@media only screen and (max-width: 384px) {    .container, #homecontent {width: 100%; }    .container .one-third.column,     .container .one-third.column .post {margin-right: 0; width: 100%; }    #homecontent .img-wrap {display: block; width: 100%; overflow: hidden; }    .one-third a img.attachment-thumbnail {margin-left: 0; }}
Salin selepas log masuk

可以参考bootstrap.网址www.bootcss.com

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan