background-color

# background-color

CSS属性中的 background-color 会设置元素的背景色，属性的值为颜色值或关键字"transparent"二者选其一。

# uni-app x 兼容性

Web	Android	iOS
4.0	3.9	4.11

# 浏览器兼容性

Chrome	Edge	Firefox	Opera	Safari	IE
√（ 1 ）	√（ 12 ）	√（ 1 ）	√（ 3.5 ）	√（ 1 ）	√（ 4 ）

# 语法

background-color: <color>;

# 默认值

transparent

# 示例

hello uni-app x

Template

<template>
  <!-- #ifdef APP -->
  <scroll-view style="flex: 1">
  <!-- #endif -->
    <view style="flex-grow: 1">
      <view>
        <text>background-color: red</text>
        <view class="common" style="background-color: red"></view>
      </view>

      <view>
        <text>background-color: #ff0000</text>
        <view class="common" style="background-color: #ff0000"></view>
      </view>

      <view>
        <text>background-color: #f00</text>
        <view class="common" style="background-color: #f00"></view>
      </view>

      <view>
        <text>background-color: rgb(255, 0, 0)</text>
        <view class="common" style="background-color: rgb(255, 0, 0)"></view>
      </view>

      <view>
        <text>background-color: rgba(255, 0, 0, 0.5)</text>
        <view class="common" style="background-color: rgba(255, 0, 0, 0.5)"></view>
      </view>
    </view>
  <!-- #ifdef APP -->
  </scroll-view>
  <!-- #endif -->
</template>

<style>
  .common {
    width: 250px;
    height: 250px;
  }
</style>