技术头条 - 一个快速在微博传播文章的方式     搜索本站
您现在的位置首页 --> CSS/HTML --> 网页适配手机移动版的CSS

网页适配手机移动版的CSS

浏览:1722次  出处信息

   首先, 禁止网页缩放, 在 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;
}

建议继续学习:

  1. 手机界面适配    (阅读:4846)
  2. Android设计中的.9.png    (阅读:3569)
  3. 手机客户端交互适配设计之我见    (阅读:2566)
  4. 客户端交互设计适配之――屏幕大小    (阅读:1731)
  5. 大屏 iPhone 的适配    (阅读:1431)
QQ技术交流群:445447336,欢迎加入!
扫一扫订阅我的微信号:IT技术博客大学习
© 2009 - 2024 by blogread.cn 微博:@IT技术博客大学习

京ICP备15002552号-1