最近在对ipad和安卓平板做测试,发现我自己写的一个下拉控件在安卓浏览器里面被遮盖了,但是PC或者ipad都没有这个现象,一开始以为是z-index 可是无论我调多少都没有用,研究了好久,发现是代码的位置问题

首先我们看下效果图

在电脑上我用的是IE

在安卓浏览器我用的是QQ浏览器(HD)

可以发现,安卓上面被遮挡了

原因就是我把mydiv1放在外层inputdiv_1的里面

代码:

<div id="inputdiv_1">
<input id="price_1" name="price_1" value="" autocomplete="off" onfocus="GetBuyPrice(this)" onblur="InputValue(this);SumMoeny();">
<div id="mydiv1" style="position: absolute; left: 725.5px; top: 113px;">
<div style="width: 197px" class="downlist">
<div>单价:.28元 时间:--</div>
<div>单价:.28元 时间:--</div>
</div>
</div>
</div>

这样父元素就会把子元素遮盖了

如果把mydiv1提到外层和父元素同级,则就不会被遮盖了

正确代码如下:放在</div>后面

 </div>
<div id="mydiv1" style="position: absolute; left: 725.5px; top: 113px;">
<div style="width: 197px" class="downlist">
<div>单价:.28元 时间:--</div>
<div>单价:.28元 时间:--</div>
</div>
</div>

这样无论是安卓浏览器还是IE都显示在最顶层了

div绝对定位针对手机浏览器的区别的更多相关文章

  1. 记录-div绝对定位针对手机浏览器的区别

    最近搞个wap ,有一个需求就是一些文字描述定位到一张图片上的某个地方,按照以往的方式直接通过定位div position: absolute; PC chrome 模拟手机显示没问题! 但是,在ip ...

  2. DIV与SPAN之间有什么区别

    DIV与SPAN之间有什么区别 DIV 和 SPAN 元素最大的特点是默认都没有对元素内的对象进行任何格式化渲染.主要用于应用样式表(共同点). 两者最明显的区别在于DIV是块元素,而SPAN是行内元 ...

  3. Appium自动化(16) - 使用手机浏览器进行自动化测试

    如果你还想从头学起Appium,可以看看这个系列的文章哦! https://www.cnblogs.com/poloyy/category/1693896.html 前言 前面我都讲的都是针对 app ...

  4. css3在不同型号手机浏览器上的兼容一览表

    网上搜集了css3对不同系统手机浏览器的支持情况(ios/android/winphone)备份一下以便查看.  以下资料由微信产品部"白树"整理, 转载请注明. √:完全支持   ...

  5. web app 禁用手机浏览器缓存方法

    开发过web app的同学,特别是前端人员,都碰到这烦人的事情,JS或CSS代码改变,可手机浏览器怎么刷新都不更新,手机浏览器的缓存特别恶劣. 所以今天贴个方法解决这问题.记得,本地调试的时候贴上,上 ...

  6. 针对各种浏览器css不兼容的写法

    /*针对谷歌浏览器内核支持的CSS样式*/@media screen and (-webkit-min-device-pixel-ratio:0) { 样式 } /*针对IE6特制识别的CSS样式*/ ...

  7. 微信或手机浏览器在线显示office文件(已測试ios、android)

    近期开发微信企业号,发现微信andriod版内置浏览器在打开文件方面有问题,可是ios版没有问题.原因是ios版使用的是safari浏览器 支持文档直接打开.可是andriod版使用的是腾讯浏览器x5 ...

  8. 【百度地图API】手机浏览器抓包工具及其使用方法

    原文:[百度地图API]手机浏览器抓包工具及其使用方法 摘要:为了测试地图API在手机浏览器上的性能,需要给手机浏览器设置代理.通过代理,我们可以在PC上获取到抓包数据.进而对性能做进一步分析. -- ...

  9. html兼容手机浏览器

    其实主要就是改掉HTML页面声明: 在网页中加入以下代码,就可以正常显示了: <meta name="viewport" content="width=device ...

随机推荐

  1. 面向对象程序设计(OOP设计模式)-行为型模式之观察者模式的应用与实现

    课程名称:程序设计方法学 实验5:OOP设计模式-行为型模式的应用与实现 时间:2015年12月02日三,第3.4节地点:理 一.实验目的 加深对行为型设计模式的理解以及在开发中的实际应用能力. 二. ...

  2. eclipse svn登陆用户保存信息删除

    win7系统 eclipse svn saveinfo path:磁盘:\%用户名%\AppData\Roaming\Subversion\auth\svn.simple 例如:D:\Users\用户 ...

  3. SVN标准开发布局目录,trunk,branches,tags用法详解

    http://www.cnblogs.com/newstar/archive/2011/01/04/svn.html 关于 SVN 目录结构       Subversion有一个很标准的目录结构,是 ...

  4. JS阻止冒泡方法(转)

    S事件流其中一种是冒泡事件,当一个元素被触发一个事件时,该目标元素的事件会优先被执行,然后向外传播到每个祖先元素,恰如水里的一个泡泡似的,从产生就一直往上浮,到在水平面时,它才消失.在这个过程中,如果 ...

  5. 奇葩属性:layout_weight 的解释及使用

    在Android的控件布局中,有一个奇葩的 layout_weight 属性,定义如下: layout_weight : 用于指定剩余空闲空间的分割比例.用法: 01 <LinearLayout ...

  6. mac下安装mysql 1820 重置默认密码

    mac安装mysql时会给出一个临时密码 记录下来 2018-03-17T02:14:10.809431Z 1 [Note] A temporary password is generated for ...

  7. Fix-Mapped Addresses

    一.前言 某天,wowo同学突然来了一句:如果要在start_kernel中点LED,ioremap在什么时间点才能调用呢?我想他应该是想通过点LED灯来调试start_kernel之后的初始化的代码 ...

  8. SqlServer 获取汉字的拼音首字母

    一.该函数传入字符串,返回数据为:如果为汉字字符,返回该字符的首字母,如果为非汉字字符,则返回本身.二.用到的知识点:汉字对应的UNICODE值,汉字的排序规则.三.数据库函数: CREATE FUN ...

  9. java连接mysql数据库实例

    做游戏客户端多一年多了,在大学学的java的SSH,基本上都忘完了,今天看了一下发现基本的连接数据库的都忘了...太可怕了这遗忘的速度. 所以写了个连接的例子吧..安装好mysql数据库之后新建了两张 ...

  10. Apply Bug10010310 On Oracle RAC 10.2.0.5

    9月24日数据库上频繁出现例如以下错误 Errors in file /u04/admin/njord/udump/njord_ora_25895.trc: ORA-27300: OS system ...