这里有个关键的东西叫做viewport,你经常在页面的头部里可以见到它:

<meta name="viewport" content="width=device-width, initial-scale=1.0">

想起来了吧,就是它让你的页面不会像在桌面上那样显示,玩过windows的放大镜功能吧, 你可以把viewport想象成一个类似的放大镜,fixed的元素是相对整个页面固定位置的,你在屏幕上滑动只是在移动这个所谓的viewport,原来的网页还好好的在那,fixed的内容也没有变过位置,所以说并不是iOS不支持fixed,只是fixed的元素不是相对手机屏幕固定的。换个角度,如果所有fixed的元素都相对屏幕固定,那那些桌面版的网页在手机上还能看吗。

解决方案。1.框架 。有很多手机端框架 已经解决了这个问题

2.用position:absolute,绝对定位 然后通过JS 跟着屏幕滚动而滚动 达到固定定位的效果

移动端— position: fixed;固定定位解决方案的更多相关文章

  1. 移动端底部fixed固定定位输入框ios下不兼容

    简短记录下最近开发移动端项目碰到的小坑,产品需求做一个售后对话页面,底部固定输入框,和微信对话差不多,但是在ios下,fixed失效,输入框被虚拟键盘挡住,在安卓下是正常的. 尝试过网上说的很多方法, ...

  2. CSS——fixed 固定定位相对于父容器

    position:fixed 固定定位 用 left top 都是相对于浏览器的. 我今天想给网页做一个固定定位的导航 偶然间发现.可以用margin 相对于父容器定位. 小伙伴们可以试试. 不用le ...

  3. 关于苹果手机微信端 position: fixed定位top导航栏问题

    在移动端,position: fixed定位一般不被识别,或者在ios系统中,获取input焦点时,会导致position: fixed的top失效,下面是我验证过的方法,大家可以试试.<!do ...

  4. 在移动端H5开发中(关于安卓端position:fixed和position:absolute;和虚拟键盘冲突的问题,以及解决方案)

    一.在开发移动端webapp时,我们经常会遇到这样的问题,当我们需要在页面底部固定一个logo或者说明时,往往会采用position:fixed进行固定定位或者absolute定位到最底部 这是一个很 ...

  5. 移动端position:fixed 解决方案

    相信不少人做移动端项目的时候都会遇到position:fixed 的坑. 下面提供一个解决方法,不用引入任何其他的js库,纯css解决. 解决问题的关键就是:fixed元素内部必须嵌套一个positi ...

  6. position之fixed固定定位、absolute绝对定位和relative相对定位

    什么是层模型? 什么是层布局模型?层布局模型就像是图像软件PhotoShop中非常流行的图层编辑功能一样,每个图层能够精确定位操作,但在网页设计领域,由于网页大小的活动性,层布局没能受到热捧.但是在网 ...

  7. 【CSS3】---层模型position之fixed固定定位、absolute绝对定位和relative相对定位

    什么是层模型? 什么是层布局模型?层布局模型就像是图像软件PhotoShop中非常流行的图层编辑功能一样,每个图层能够精确定位操作,但在网页设计领域,由于网页大小的活动性,层布局没能受到热捧.但是在网 ...

  8. 浮动层固定兼容IE6 position:fixed的最佳解决方案

    第一种:css方法 有时候当我们需要把一个元素固定在页面的某个部位,一般都是用css中的“position:fixed;”方法来解决,但是IE6不支持fixed,所以今天分享一个兼容IE6的页面底部固 ...

  9. position:fixed固定定位的用法

    一.position:fixed:固定定位 1.实现某个元素在可视窗口的居中位置显示 1)给自身设置宽高: 2)给自身加position:fixed: 3)用margin向左移动自身宽度的一半,向上移 ...

随机推荐

  1. Golang的单目(一元)运算符-地址操作符和接收操作符

    Golang的单目(一元)运算符-地址操作符和接收操作符 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.Golang的单目(一元)运算符概述 常见的地址操作符: &: ...

  2. 中兴将用“加减乘除”建立理想 5G 网络

      6 月 28 日,MWC 2019 上海展期间,中兴通讯执行董事.总裁徐子阳发表演讲表示,面对 5G 建网大势,要看破大势,不破不立.为此中兴将用“加减乘除”建立理想 5G 网络. 何为“加减乘除 ...

  3. C++面试常见问题——06数组排序

    数组排序 冒泡.最简单的冒泡,没啥好讲的 #include<iostream> using namespace std; void BubbleSort(int a[],int len){ ...

  4. Spring Boot -- Spring Boot之@Async异步调用、Mybatis、事务管理等

    这一节将在上一节的基础上,继续深入学习Spring Boot相关知识,其中主要包括@Async异步调用,@Value自定义参数.Mybatis.事务管理等. 本节所使用的代码是在上一节项目代码中,继续 ...

  5. 这26个为什么,让初学者理解Python更简单!

    为什么Python使用缩进来分组语句? 为什么简单的算术运算得到奇怪的结果? 为什么浮点计算不准确? 为什么Python字符串是不可变的? 为什么必须在方法定义和调用中显式使用“self”? 为什么不 ...

  6. C++ for无限循环~

    无限循环 如果条件永远不为假,则循环将变成无限循环.for 循环在传统意义上可用于实现无限循环.由于构成循环的三个表达式中任何一个都不是必需的,您可以将某些条件表达式留空来构成一个无限循环. #inc ...

  7. SPOJ_DSUBSEQ Distinct Subsequences

    统计一个只由大写字母构成的字符串的,子串数目,这里指的是子串不是子序列,可以不连续,请注意 然后我按照计数DP的思想,dp[i][j]表示长度为i的子串,最后一个字母为j 然后为了去重,每一次dp的时 ...

  8. hdu 3790 最短路径dijkstra(多重权值)

    最短路径问题 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Subm ...

  9. Mac使用安卓模拟器-网易MuMu

    先看下效果图 近期,因为小编把安卓手机倒手了,但现在还想看看一些安卓应用.所以就搜罗了很多市场上的模拟器. 最终选定了网易的MuMu,总体感觉网易也是花了很大的心思,整体效果超赞. 下载地址 网易Mu ...

  10. 编程入门-Eclipse的断点调试

    编程入门-Eclipse的断点调试 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 1>.双击选中你要调试的代码行数 2>.允许方法透视图 3>.进行代码调试 4& ...