网页适配手机移动版的CSS
浏览:1670次 出处信息
首先, 禁止网页缩放, 在 HTML head 里加入
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
接着, 避免图片撑大网页, 出现横向滚动条, 设置 img 标签的 CSS
img{ max-width: 100%; }
最后, 对某些表格或者表单等, 我们希望在电脑版(正常版)网页上有最大宽度, 但在手机上则希望是 100% 宽度, 这时, 便可利用 max-width 参数
.container{ width: 100%; max-width: 880px; }
建议继续学习:
- 手机界面适配 (阅读:4505)
- Android设计中的.9.png (阅读:2906)
- 手机客户端交互适配设计之我见 (阅读:2302)
- 客户端交互设计适配之――屏幕大小 (阅读:1585)
- 大屏 iPhone 的适配 (阅读:1212)
QQ技术交流群:445447336,欢迎加入!
扫一扫订阅我的微信号:IT技术博客大学习
扫一扫订阅我的微信号:IT技术博客大学习
后一篇:IE开始支持部分webkit私有属性 >>
文章信息
- 作者:ideawu 来源: idea's blog
- 标签: 适配
- 发布时间:2014-07-15 22:45:45
近3天十大热文
- [12] 产品设计之QQ邮箱登录页与淘宝登录页
- [10] Python连接 MySQL 数据库的超时问
- [8] 分布式系统的事务处理
- [8] 读书:谣言
- [8] 一个 VLA (可变长度数组)的实现
- [7] 移动Web开发初学者指南
- [7] 一句话crontab实现防ssh暴力破解
- [7] iptables 看门狗
- [7] 数据与理论结合,让交互设计更专业
- [7] 细说促销(三):促销的实施