最近在对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. 教你动手做一个 iOS 越狱 app

    前言 俗话说得好, 万事开头难. 仅仅是上图一个如此简单地不能再简单的小app, 其实都不算是app, 只是注入了一段代码进系统中, 等到特定的函数方法调用的时候就会被我们hook掉, 执行我们写的代 ...

  2. 手机imie号介绍使用

    http://zhidao.baidu.com/question/3682744.html手机机身号又叫手机串号,是国际移动设备识别码,GSM手机机身号简称IMEI,CDMA手机机身号简称ESN. 一 ...

  3. 基于配置的Spring MVC3

    网上查找的spring mvc3大部分都是基于注射的方式,总感觉注射有点怪怪.不利于后期扩展和项目管理,于是特意写下这篇基于xml配置的Spring MVC3.以供大家參考. 怎么建立web项目和下载 ...

  4. mysql 返回多列的方式

    SELECT * FROM (SELECT 'success' as _result) a,(SELECT @gid as gid) b;

  5. 为anaconda的jupyter notebook设置初始化目录

    在使用jupyter进行编程时,初始化目录可能不是自己想要的目录,那么下面讲解修改成自己想要的目录. 1) 在命令行中输入jupyter notebook --generate-config,会产生一 ...

  6. js之正则表达式详解

    文章前提:会写几本的正则表达式,本文主要讲解js中关于正则方法的运用. (关于正则元字符可以查看http://www.php100.com/html/webkaifa/javascript/2010/ ...

  7. Linux下hosts、host.conf、resolv.conf的区别

    /etc/resolv.conf 该文件是DNS域名解析的配置文件,它的格式很简单,每行以一个关键字开头,后接配置参数.resolv.conf的关键字主要有四个,分别是:nameserver   #定 ...

  8. 自己写的一个操作Mysql的简单的实例

    #include <WinSock.h> #include <stdio.h> #include <iostream> #include <windows.h ...

  9. Clojure 的 Enlive 库尝试

    Enlive 是一个 Clojure 下的 html 模板引擎.其特别之处在于,它既没有发明任何 html 内嵌的模板 DSL 语法:也不会混杂代码和表现. 一切的一切,都是按下列模型定义的次序执行的 ...

  10. Unity刚体穿透问题测试以及解决

    测试环境很简单,一面墙,红色方块不停向前 然后,由于刚体是FixedUpdate执行的,把FixedUpdate执行间隔调慢一些方便Debug: OK,下面还原一次经典的穿透问题: 测试脚本: voi ...