视口

在前一段时间,我曾经写过一篇关于viewport的文章。最近由于在接触移动端开发,对viewport有了新的理解。于是,打算重新写一篇文章,介绍移动端视口的相关概念。

关于这篇文章说到的所有知识,本质上离不开以下代码

<meta name="viewport" content="width=device-width, initial-scala=1, maximum-scale=1, minimum-scale=1, user-scalable=no" />

@media all and (max-width: 320px) {    // do something
}

了解过移动端开发的朋友,其实对以上的代码就不会陌生。上面的代码,主要涉及到meta视口标签与媒体查询。单单以上简短的代码就需要明白:

  • 像素(pixel)

  • 视口(viewport)

  • 分辨率(resolution)

  • meta视口标签

  • 媒体查询(media query)

  • JavaScript相关的属性和方法

  • 如何实现移动端响应式适配的问题

那就进入主题吧:)

延伸阅读

学习是年轻人改变自己的最好方式-Java培训,做最负责任的教育,学习改变命运,软件学习,再就业,大学生如何就业,帮大学生找到好工作,lphotoshop培训,电脑培训,电脑维修培训,移动软件开发培训,网站设计培训,网站建设培训学习是年轻人改变自己的最好方式