zoukankan      html  css  js  c++  java
  • [bug]小米部分机型(5x、mix2)中,文字/背景闪现然后消失

    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,不要问我,我也不知道。

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

  • 相关阅读:
    java学习笔记(四)
    Sigmoid 函数
    Neural Architectures for Named Entity Recognition 学习笔记
    java学习笔记(三)
    java学习笔记(二)
    Java学习笔记(一)
    shell 小技巧
    Network Embedding 相关论文
    C++学习笔记(二)
    js判断某字符出现的个数
  • 原文地址:https://www.cnblogs.com/fayin/p/8376269.html
Copyright © 2011-2022 走看看