移动端适配,华为浏览器底色无法正常显示

第一个是不显示背景色的,第二个是正常样式,这里是只有在手机端的华为浏览器出问题
解决: 看看代码中颜色的值写的是几个f, 我写的是#ffff,但正确的应该是#fff

关于这个,我一直想扩展一下的,关于颜色的值:
background-color

常见的有三种值:

Keyword values,浏览器内置的颜色关键字,如:

background-color: red;

Hexadecimal value,十六进制表示颜色,#RRGGBBRR（红色）、GG（绿色）和 BB（蓝色）是 00 到 FF 之间的十六进制整数，用于指定颜色的强度。,如:

background-color: #bbff00;

RGB value,如:

background-color: rgb(255, 255, 128);

但上面这个还可以写为rgba,第四个值就是透明度如:

background-color: rgba(255, 255, 128m,0.2);

还有其他的写法:

HSLA value,如:

background-color: hsla(50, 33%, 25%, 0.75);

HSLA(H,S,L,A),
H:Hue(色调)。0(或360)表示红色，120表示绿色，240表示蓝色，也可取其他数值来指定颜色。取值为：0 - 360
S:Saturation(饱和度)。取值为：0.0% - 100.0%
L:Lightness(亮度)。取值为：0.0% - 100.0%
A:Alpha透明度。取值0~1之间。

Special keyword values,如:

background-color: currentColor;
background-color: transparent;

currentColor,从上面的父级元素继承color
transparent:透明

Global values,如:

background-color: inherit;
background-color: initial;
background-color: unset;

inherit:inherit 关键字使得元素获取其父元素的计算值。它可以应用于任何 CSS 属性，包括 CSS 简写 all
initial:CSS 关键字 initial 将属性的初始（或默认）值应用于元素。不应将初始值与浏览器样式表指定的值混淆。它可以应用于任何 CSS 属性。这包括 CSS 简写 all，initial 可用于将所有 CSS 属性恢复到其初始状态。
unset:CSS 关键字 unset 可以分为两种情况，如果这个属性本来有从父级继承的值（这个属性默认可以继承，且父级有定义），则将该属性重新设置为继承的值，如果没有继承父级样式，则将该属性重新设置为初始值。换句话说，在第一种情况下（继承属性）它的行为类似于inherit ，在第二种情况下（非继承属性）类似于initial。它可以应用于任何 CSS 属性，包括 CSS 简写属性 all
抄袭来自:MDN

移动端适配,华为浏览器底色无法正常显示相关推荐

vue怎么给pc端浏览器设置一个最小屏幕_vue项目实现移动端适配的案例
前言:使用vue开发移动端页面时,往往需要实现页面根据不同设备屏幕进行尺寸的适配,实现将px自动换算成rem单位,其实只需要安装下面的两个插件即可快速实现移动端适配问题. 1 准备工作: a. 安装 ...
java中浏览器电脑的分辨率_关于移动端适配，你必须要知道的
原标题:关于移动端适配,你必须要知道的来自公众号:code秘密花园导读移动端适配,是我们在开发中经常会遇到的,这里面可能会遇到非常多的问题: 1px问题 UI图完美适配方案 iPhoneX适配方 ...
浏览器兼容和移动端适配方案
1.浏览器兼容: 一.css兼容: 不同浏览器的标签默认的margin和padding不同问题症状: 随便写几个标签,不加样式控制的情况下,各自的margin 和padding差异较大. 碰到频率: ...
自定义PC端华为浏览器主页壁纸
华为浏览器可通过在地址栏键入hwbrowser://settings/homepage或者点击右上角三点>设置>主页设置更改主页壁纸.但是这样仅能改为官方预设的几种壁纸而非自己的图片,经过 ...
移动端适配（必须要知道的，亲测有效）
关于移动端适配(必须要知道的,亲测有效) 一.各种单位概念理解二.移动,web开发三.移动端适配 1.视口(viewport)概念 2.视口(viewport)适配(代码) 3.rem单位适配 f ...
移动端适配指南！聊聊安卓折叠屏给交互设计和开发带来的变化
移动端的时代前端同学面临着各种适配的处理.刘海机的出现,前端需要考虑刘海机适配.如今,随着折叠屏手机的面世,前端同学接着又要处理折叠屏幕的适配.本文除了介绍折叠机给我们带来的变化之外,还提出了响应式设 ...
移动端适配之二：visual viewport、layout viewport和ideal viewport介绍
上一篇博文,可算把像素这个东西讲清楚了.在这篇博文里面,将继续介绍viewport相关的内容. 很多博客都会提到PPK所讲的三个viewport,有的讲的比较复杂,看的云里雾里,我这里也大概介绍一下, ...
chrome 适配调试_移动端适配
前言原文 && 个人主页知乎&&知乎专栏背景随着移动端的普及,以及手机尺寸越来越多,这就衍生了众多的适配方案,以下挑一些常见的适配方案进行探讨. 本文默认读者已 ...
移动端布局三种视口_移动端适配之视口和meta标签
这是关于移动端适配的第一篇文章,这篇文章主要介绍视口以及和视口有关的meta标签的使用. 不管三七二十一,我们先新建一个页面: 这不是一个demo *{margin: 0; padding: 0;} ...
移动端适配 rem
前置知识: 物理像素(physical pixel,device pixel) 物理像素(设备像素),显示设备中一个最微小的物理部件.每个像素可以根据操作系统设置自己的颜色和亮度. 设备独立像素(de ...

移动端适配,华为浏览器底色无法正常显示

移动端适配,华为浏览器底色无法正常显示相关推荐

最新文章

热门文章