格式:`RRGGBB`
css
body { background-color: ff0000; } / 纯红色 /
格式:`rgb(红, 绿, 蓝)`(0-255)
css
body { background-color: rgb(0, 255, 0); } / 纯绿色 /
格式:`rgba(红, 绿, 蓝, 透明度)`(透明度:0-1)
css
body { background-color: rgba(0, 0, 255, 0.5); } / 半透明蓝色 /
直接使用英文颜色名称(支持140+种)
css
body { background-color: coral; } / 珊瑚色 /
格式:`hsl(色相, 饱和度%, 明度%)`
css
body { background-color: hsl(120, 100%, 50%); } / 亮绿色 /
| 颜色 | 十六进制 | RGB | 颜色名称 |
|||||
| 白色 | FFFFFF | rgb(255,255,255) | white |
| 黑色 | 000000 | rgb(0,0,0) | black |
| 红色 | FF0000 | rgb(255,0,0) | red |
| 蓝色 | 0000FF | rgb(0,0,255) | blue |
| 绿色 | 00FF00 | rgb(0,255,0) | lime |
| 灰色 | 808080 | rgb(128,128,128)| gray |
1. 在线工具推荐:可通过 [Color Picker] 或 Photoshop 取色器获取颜色代码
2. 透明背景:使用 `rgba` 或 `hsla` 格式,最后一个参数控制透明度(0=全透明,1=不透明)
3. 现代浏览器都支持这些格式,但 IE8 及以下不支持 RGBA
4. 简写形式:`FFF` 等同于 `FFFFFF`,`09C` 等同于 `0099CC`
建议优先使用十六进制或RGB格式,需要透明度时使用RGBA格式。实际开发中推荐使用CSS预处理器(如Sass/Less)管理颜色变量。
版权声明: 知妳网保留所有权利,部分内容为网络收集,如有侵权,请联系QQ793061840删除,添加请注明来意。
工作时间:8:00-18:00
客服电话
电子邮件
admin@qq.com
扫码二维码
获取最新动态
