零基础学做网站培训介绍

当前位置:

移动站meta标签怎么做网站初始化设置

我们做手机WAP移动站时,需要使用meta标签做网站初始化设置,这样手机网站就会符合手机浏览界面了。

以下是移动站meta标签怎么做网站初始化设置。

版面宽度初始化设置


<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<meta content="yes" name="apple-mobile-web-app-capable" />
<meta content="black" name="apple-mobile-web-app-status-bar-style" />
<meta content="telephone=no" name="format-detection" />
<meta content="email=no" name="format-detection" />

手机浏览器样式初始化


html, body ,div, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form,a,img,span,em,i,b,iframe,strong,label{ padding:0; margin:0;-webkit-tap-highlight-color: rgba(0,0,0,0);}
html,body{height:100%;/*overflow-x: hidden;*/}
html{-webkit-font-smoothing: antialiased;-webkit-text-size-adjust:none;}
body{font-size: 16px;font-family:sans-serif; color: #000;background-color:#ececec;}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,main,nav,section,summary{display:block;}
ol,ul{ list-style: none; }
a{ text-decoration: none; color: #333; cursor: pointer;-webkit-touch-callout:none;}
em, i { font-style: normal; }
img{vertical-align:middle;border:none; -webkit-touch-callout:none;}
a,input, select, textarea,button { padding:0; margin:0;border: 0;outline: 0; border-radius: 0; -webkit-appearance: none;}
input:disabled{background-color: #fff;}
textarea{resize: none;}
table {border-spacing: 0;border-collapse: collapse;}

::-webkit-scrollbar {width: 3px; height:3px;background-color:transparent; }
::-webkit-scrollbar-track {background-color:transparent;}
::-webkit-scrollbar-thumb {background-color:rgba(0, 0, 0, .298039);border-radius: 2px;}

::-webkit-input-placeholder { color: #666;opacity: 1;}
:-moz-placeholder {color: #666;opacity: 1;}
::-moz-placeholder {color: #666;opacity: 1;}
:-ms-input-placeholder {color: #666;opacity: 1;}
/*自适应*/
@media screen and (max-width: 680px) {
body{font-size: 100%;}
.wrap{width: 100%;}
}
@media screen and (max-width: 480px) {
body{font-size: 14px;}
.wrap{width: 100%;}
}
@media screen and (max-width: 359px) {
body{font-size: 12px;}
.wrap{width: 100%;}
}

发表评论

电子邮件地址不会被公开。 必填项已用*标注

相关教程

  • 什么是自适应手机网站 (191070 次浏览)
    自适应手机网站又叫响应式网站,它能够自动判断用户访问设备是电脑还是手机,显示相应的网站版面。自适应手机网站通过有二种开发方式:第一种:单
  • 随着智能手机的普及,单纯的PC网站不能满足手机用户的浏览体验。我们自己建网站时,急需建立与自己PC网站同步的手机网站,来完美承接手机浏览用户的流
  • 什么是手机网站域名(无线域名)由于手机上网的用户越来越多,手机网站将是一个趋势。为了满足手机网站制作需要,推出手机网站域名。后缀为.mobi。手
  • 我们在前面的建站教程中,我们详细的带领大家学习了手机网站制作教程,通过学习这个手机网站教程,我们可以自己制作一个手机网站。今天我们来解决一
  • 现在大多网站都会配一个手机网站,方便手机用户浏览。在手机网站底部,我们会制作一种一键拔号功能,用户只需点击图标就可以直接拔打电话。(相关教程
  • 学做网站论坛最新课程——自适应手机网站制作课程已发布。自适应手机网站制作课程详细讲解如何制作自适应手机网站,最新前端开发框架bootstrap使用方法
  • 我们在制作手机网站时,如果网页上有一串数字的话,手机网站会自动给这串数字添加电话号码的链接。(相关知识:怎么做手机网站?)这样用户只要点一下
  • 据统计,现在使用手机浏览网页的人数已超过使用电脑浏览的人数。对于学习做网站的学员来说,学习创建WAP手机网站已是建网站必学的课程了。零基础新
  • 为了让手机用户浏览网站的方便,我们做网站时,会做响应式自适应网站。可以自动判断用户浏览设备进行转换网站版面。如果用户使用手机浏览就跳转到手机
  • 现在做网站基本上都是手机网站与PC网站同步的,制作手机网站时,怎么实现和PC网站共用一个域名呢?下面学做网站论坛提供了二种方法。方法一:使用响