# color

color CSS 属性设置文本及文本装饰(text-decoration)的前景色颜色值。

# uni-app x 兼容性

Web Android iOS
4.0 3.9 4.11

# 浏览器兼容性

Chrome Edge Firefox Opera Safari IE
√( 1 ) √( 12 ) √( 1 ) √( 3.5 ) √( 1 ) √( 3 )

# 语法

color: <color>;

# color 的属性值

名称 兼容性 描述
currentcolor
将颜色设置为元素的 color 属性值。但是,如果设置为 color 的值,currentcolor 将被视为 inherit。

# 默认值

平台 默认值
uvue #000000

注意:W3C 默认值为:canvastext

# 适用组件

# 示例

hello uni-app x

扫码体验(手机浏览器跳转到App直达页)

Template

Script

<template>
  <view style="flex-grow: 1;">
    <view style="height: 250px;background-color: gray;justify-content: center;align-items: center;">
      <text class="common" style="color: rgb(255, 0, 0);">color: rgb(255, 0, 0)</text>
      <text class="common" style="color: rgba(255, 0, 0, 0.5);">color: rgba(255, 0, 0, 0.5)</text>
      <text class="common" style="color: #ff0000;">color: #ff0000</text>
      <text class="common" style="color: #f00;">color: #f00</text>
      <text class="common" style="color: red;">color: red</text>
    </view>
  </view>
</template>



<style>
  .common {
    font-size: 20px;
  }
</style>

# App平台

App端 color 样式不支持继承,

# 浏览器或webview平台

所有元素都支持设置 color 样式,并支持继承。 同时会设置 currentcolor 值,currentcolor 可以用作其他属性的间接值,且为其他颜色属性(如 border-color)的默认值。

# 参见