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

在这里插入图片描述请添加图片描述

第一个是不显示背景色的,第二个是正常样式,这里是只有在手机端的华为浏览器出问题
解决: 看看代码中颜色的值写的是几个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

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

无名之辈无名之辈

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值