css - 移动平台前端开发有什么技巧?
大家讲道理
大家讲道理 2017-04-17 11:04:16
[HTML讨论组]

例如一个p,我想

  • 在PC上浏览的时候是固定 640px 的宽度,
  • 在手机上浏览的时候适应手机屏幕的宽度,

我该如何声明 meta 标签以及如何写 css ?

大家讲道理
大家讲道理

光阴似箭催人老,日月如移越少年。

全部回复(4)
黄舟

1 移动设备终端屏幕不固定,所以不能直接设定宽度或者高度。像素设置使用em单位,宽度高度设置使用百分比等。屏幕自适应还要借助 viewport属性 如:<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />

2 初步定为你的移动网站是否在支持html5的浏览器中。现在的浏览器html5支持已经很普遍,但是还有部分老机型不支持。这个涉及到是否单独加载移动端js,包括mobile.js .,进而又涉及到用户交互体验,肯定是使用html5和css3 js的网站用户体验更高。前提是用户移动端网络环境能足够支持这种页面容量。

3 观察大的电商网站,为了满足不同用户需求,手机网站一般分为3个版本 简版,触屏版,电脑版。触屏版大多启用html5开发。简版就是之前的wap升级,最不耗费流量的一种。

高洛峰

http://www.ruanyifeng.com/blog/2012/05/responsive_web_design.html

黄舟

用 media query, 找bootstrap框架学习下最快了

and: 请fork:https://github.com/AlloyTeam/Mars

怪我咯

meta标签就写:
css的话,建议你用100%的宽度去布局,所有布局都用百分比进行,然后max-width设置成640px就可以了。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号