2022-11-13 分类: 网站建设
其实对于网站建设行业来讲,先进的技术水平是本行业的致命要素,如果你没有的技术水平,不能满足客户的需求,那为什么客户还来找你建网站,你的优势又在哪里?这也是一些小的网站建设公司所存在的矛盾,技术水平不达标,单子不能签,人员的成本过高,签单的金额又不能满足平时的盈利开销。这是目前成都网站建设公司所存在的普遍问题,而我们成都网站建设-创新互联就不存在这样的问题,公司技术团队达到50多人,是目前成都网站建设公司中仅有的人员配置!而就目前的手机端网站建设来讲我们也不再话下,很多的技术都能够胜任,今天小编就来分享一下大家常用的h5中的表达效果!
H5页面窗口自动调整到设备宽度,并禁止用户缩放页面
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
忽略将页面中的数字识别为电话号码
<meta name="format-detection" content="telephone=no">
忽略Android平台中对邮箱地址的识别
<meta name="format-detection" content="email=no">
当网站添加到主屏幕快速启动方式,可隐藏地址栏,仅针对ios的safari
<meta name="apple-mobile-web-app-capable" content="yes">
<!-- ios7.0版本以后,safari上已看不到效果 -->
将网站添加到主屏幕快速启动方式,仅针对ios的safari顶端状态条的样式
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<!-- 可选default、black、black-translucent -->
viewport模板——通用
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<meta name="format-detection" content="email=no">
<link rel="stylesheet" href="index.css">
这里开始内容
viewport模板 – target-densitydpi=device-dpi,android 2.3.5以下版本不支持
01
<meta name="viewport" content="width=750, user-scalable=no, target-densitydpi=device-dpi"><!-- width取值与页面定义的宽度一致 -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<meta name="format-detection" content="email=no">
<link rel="stylesheet" href="index.css">
这里开始内容
移动端如何定义字体font-family
中文字体使用系统默认即可,英文用Helvetica
body{font-family:Helvetica;}
移动端字体单位font-size选择px还是rem
对于只需要适配少部分手机设备,且分辨率对页面影响不大的,使用px即可
对于需要适配各种移动设备,使用rem,例如只需要适配iPhone和iPad等分辨率差别比较挺大的设备
rem配置参考:
html{font-size:10px}
@media screen and (min-width:321px) and (max-width:375px){html{font-size:11px}}
@media screen and (min-width:376px) and (max-width:414px){html{font-size:12px}}
@media screen and (min-width:415px) and (max-width:639px){html{font-size:15px}}
@media screen and (min-width:640px) and (max-width:719px){html{font-size:20px}}
@media screen and (min-width:720px) and (max-width:749px){html{font-size:22.5px}}
@media screen and (min-width:750px) and (max-width:799px){html{font-size:23.5px}}
@media screen and (min-width:800px){html{font-size:25px}}
文章题目:html5可以通用的几段代码
网址分享:/news41/213291.html
成都网站建设公司_创新互联,为您提供App设计、云服务器、品牌网站制作、全网营销推广、小程序开发、网站收录
声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联
猜你还喜欢下面的内容