2/9更新

后来遇到float 元素也这样,改成flex布局就没问题。不知道具体原因。

描述:

使用vue 2.4开发HTML5时,遇到在小米部分机型(5x、mix2)中,文字/文字背景闪现然后消失。

如下,.a-blue-block的蓝色背景闪现一下,接着蓝色背景突然消失,只剩下文字。

html 结构:

      <div class="pannel-item" v-for="(item, index) in ps" :key="index">
<div class="a-blue-block">
<div class="title">
<span>{{item.name}}</span>
<span v-if="item.ename">{{item.ename}}</span>
</div>
<div class="desc">{{item.itn}} {{item.idcard}}</div>
</div>
<div>

部分css

$rem: 1 / 18.75 * 1rem;
.a-blue-block {
padding: 16*$rem 20*$rem;
border-radius: 6 * $rem;
color: #000;
background: #1188FF;
box-shadow: 0 4px 10px #ccc;
}

修复:

在消失元素的父级上,添加background:#fff

至于为什么会出现这个bug,以及添加白色/任意背景可以修复这个bug,不要问我,我也不知道。

如果哪天有人遇到或知道为什么,希望能够告诉我。

[bug]小米部分机型(5x、mix2)中,文字/背景闪现然后消失的更多相关文章

  1. 小程序canvas中文字设置居中锚点

    小程序中经常会遇到要生成图片的需求,图片一般会加上用户的头像和昵称之类的,头像只需要把腾讯域名添加到request和download列表中,使用wx.getImageInfo()就可以缓存到本地,成功 ...

  2. win7下eclipse中文字显示过小

    用win7英文版系统,在eclipse里输入中文字的时候小的可怜,今天实在忍不下去了,随网上搜了搜找到了解决办法,记录下来备用. 操作步骤:打开Elcipse --点击菜单栏上的 “Windows”— ...

  3. MFC中修改静态文本框中文字的字体、颜色

    假设有一个静态文本框控件,其ID为:IDC_STATIC_XSDJ,且关联一个control类的CStatic类型的变量m_static_xsdj. 设置字体时自然要用到CFont类,下面介绍两种方法 ...

  4. tahoma字体对中文字的影响

    一提到tahoma字体大家都会想到,它是一个英文字体,对中文不会有影响. 但是今天就遇到一个问题,tahoma字体会影响中文字的显示,如: html代码: <div class="bo ...

  5. PHP实现中文字串截取无乱码的方法

    直接使用PHP函数substr截取中文字符可能会出现乱码,主要是substr可能硬生生的将一个中文字符“锯”成两半.解决办法: 1.使用mbstring扩展库的mb_substr截取就不会出现乱码了. ...

  6. 段落排版--中文字间距、字母间距(letter-spacing, word-spacing)

    中文字间隔.字母间隔设置: 如果想在网页排版中设置文字间隔或者字母间隔就可以使用    letter-spacing 来实现,如下面代码: h1{ letter-spacing:50px; } ... ...

  7. winform 绘制label 中文字 - 摘

    private void label2_Paint(object sender, PaintEventArgs e) {//绘制label中文字 string text = "Sri Lan ...

  8. HTML5之placeholder属性以及如何更改placeholder属性中文字颜色

    今天在群里看到群友问了一个这样的问题,就是如何更改placeholder属性中文字的颜色,以前用过这属性,却是没更改过颜色,于是便试了试,中途遇到些问题,查找资料后特来总结一下. 熟悉HTML5的人应 ...

  9. js按照特定的中文字进行排序的方法

    之前遇到过按照中文字符排序的需求很顺利的解决了,这次是按照特定的中文字进行排序,比如按照保守型,稳健型,平衡型,成长型,进取型进行排序. 可以使用localeCompare() 方法来实现中文按照拼音 ...

随机推荐

  1. composer install 时,提示:Package yiisoft/yii2-codeception is abandoned, you should avoid using it. Use codeception/codeception instead.的解决

    由 SHUIJINGWAN · 2017/11/24 1.composer install 时,提示:Package yiisoft/yii2-codeception is abandoned, yo ...

  2. [ Laravel 5.5 文档 ] 底层原理 —— 一次 Laravel 请求的生命周期

     Posted on 2018年3月5日 by  学院君 简介 当我们使用现实世界中的任何工具时,如果理解了该工具的工作原理,那么用起来就会得心应手,应用开发也是如此.当你理解了开发工具如何工作,用起 ...

  3. 3. Install Spring-Tool-Suite & TestNG

    1.Install Spring-Tool-Suite 2.Install TestNG

  4. process_进程池_2

    import multiprocessingimport os, time, random def Lee(): print("\nRun task Lee-%s" %(os.ge ...

  5. exit--进程退出;wait--进程等待;execl--执行程序

    函数原型:void exit(int status) 参数说明:退出状态. 函数原型:pid_t wait(int *status) 头文件:#include<sys/types.h>,# ...

  6. 643. Maximum Average Subarray I

    static int wing=[]() { std::ios::sync_with_stdio(false); cin.tie(NULL); ; }(); class Solution { publ ...

  7. 第五章:动词(Les verbes)

    ★及物动词(Les verbes transitifs) 主语发出的动作作用于人或物,它又分为两类,直接及物动词和间接及物动词. ()直接及物动词:动词直接带宾语,不需要介词引导.如:         ...

  8. docker镜像基本操作

    操作镜像 使用 docker 命令行操作 docker 镜像 获取镜像 使用「docker pull +镜像名称」从网络上下载image镜像 core@localhost ~ $ docker pul ...

  9. spring+hibernate 整合异常 Class 'org.apache.commons.dbcp.BasicDataSource' not found

    解决方法 添加 commons-dbcp.jar和commons-pool.jar包

  10. Proxy Hosted Virtual

    http://books.sonatype.com/nexus-book/reference/confignx-sect-manage-repo.html Public Repositories 对外 ...