最近在对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. 【LeetCode】43. Multiply Strings

    Multiply Strings Given two numbers represented as strings, return multiplication of the numbers as a ...

  2. 创业就是和靠谱的人一起做热爱的事 印象笔记CEO谈创业

    http://www.nowamagic.net/librarys/news/detail/1502在今年美国知名创业孵化器 Y Combinator 的创业学校大会上,印象笔记(Evernote)的 ...

  3. Linux命令-下载文件的工具:wget

    Linux系统中的wget是一个下载文件的工具,它用在命令行下.对于Linux用户是必不可少的工具,我们经常要下载一些软件或从远程服务器恢复备份到本地服务器.wget支持HTTP,HTTPS和FTP协 ...

  4. 避免全表扫描的sql优化

    对查询进行优化,应尽量避免全表扫描,首先应考虑在where 及order by 涉及的列上建立索引:  .尝试下面的技巧以避免优化器错选了表扫描: ·   使用ANALYZE TABLE tbl_na ...

  5. Python学习笔记015——文件file的常规操作之一(文本文件)

    1 什么是文件 文件是用于数据存储的单位 文件通常用来长期保存数据 读写文件是最常见的I/O操作.Python内置了读写文件的函数,用法和C是兼容的. 读写文件的功能都是由操作系统提供的,一般而言,操 ...

  6. PLSQL_统计信息系列02_统计信息的对象

    20150505 Created By BaoXinjian

  7. linux write系统调用如何实现

    在Linux下我们在使用设备的时候,都会用到write这个函数,通过这个函数我们可以象使用文件那样向设备传送数据.可是为什么用户使用write函数就可以把数据写到设备里面去,这个过程到底是怎么实现的呢 ...

  8. WordPress For SAE进入后台

    今天遇到一个非常easy可是花了我半个小时的问题:怎样进入WordPress For SAE后台. 介于百度上没有搜索到.所以写了这篇博客,简单,but有用. 首先我们会訪问自己的网站:独立游戏者er ...

  9. 转 CAS实现SSO单点登录原理

    原文链接   http://m.blog.csdn.net/hxpjava1/article/details/74019017 CAS 简介 1. 1.1.  What is CAS ? CAS (  ...

  10. 使用xtrabackup(innobackupex)实现MySQL的热备

    mysql 的热备http://www.178linux.com/10139http://www.linuxidc.com/Linux/2014-04/99671.htmhttp://634871.b ...