rgba()的alpha值必须是0--1小数而非百分比或整数;仅透明背景用rgba(),整体透明用opacity;IE8需前置fallback色值;backdrop-filter生效需背后有真实内容。rgba() 里 alpha 值不是百分比,是 0--1 的小数很多人写 rgba(0, 0, 0, 50%) 或 rgba(0, 0, 0, 50),结果背景不透明------浏览器直接忽略整条声明。CSS 的 rgba() 第四个参数必须是 0 到 1 之间的小数,0.5 才等于 50% 透明度。常见错误现象:background-color: rgba(255, 255, 255, 100) 看似"100% 不透明",实际无效;rgba(0, 0, 0, 0.0) 是完全透明,rgba(0, 0, 0, 1.0) 是完全不透明。alpha = 0.0:背景彻底消失(但元素仍占位)alpha = 0.8:适合蒙层,文字可读又压得住底图alpha = 0.1:极淡遮罩,常用于 subtle hover 效果透明背景和 opacity 的关键区别在哪opacity 会让整个元素(包括子内容、边框、阴影)一起变透明;而 rgba() 只作用于当前颜色属性(比如 background-color),文字、子元素保持原样。使用场景:做卡片浮层时,用 background-color: rgba(255, 255, 255, 0.9) 能让背景微透、文字清晰;若误用 opacity: 0.9,标题和按钮也会发虚,可读性下降。立即学习"前端免费学习笔记(深入)"; Ideogram Ideogram是一个全新的文本转图像AI绘画生成平台,擅长于生成带有文本的图像,如LOGO上的字母、数字等。
相关推荐
盟接之桥6 小时前
线束数字化--先进先出为什么总是停留在纸面上?Python图像识别6 小时前
18-【2027毕设】YOLO11烟雾检测识别系统 - Python完整源码+PyQt5界面+训练模型+数据集FYKJ_20106 小时前
springboot助农产品销售商城05829-计算机课程设计、毕业设计Yunovian6 小时前
AI时代,针对模型与应用,浅谈一下各编程语言weixin_457760007 小时前
基于 YOLO11m-Pose 的动物姿态估计系统:从 Animal-Pose 标注到 Python 桌面部署adinnet20267 小时前
预算管控:预算执行与偏差问数Ticnix7 小时前
RAG 烂大街?烂大街的只是那条流水线——真正的分水岭在这五处Wx-bishekaifayuan7 小时前
springboot社区扶贫救助管理系统13300-计算机课程设计、毕业设计小小张说故事8 小时前
LightGBM 入门指南:更快的梯度提升树,Python 实战Ticnix8 小时前
RAG 检索不准,九成的锅不在向量——不同文件,就该有不同的入库方案