background-color

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

示例

/* keyword values */
background-color: red;

/* hexadecimal value */
background-color: #bbff00;

/* rgb value */
background-color: rgb(255, 255, 128);

/* hsla value */
background-color: hsla(50, 33%, 25%, 0.75);

/* special keyword values */
background-color: currentcolor;
background-color: transparent;

/* global values */
background-color: inherit;
background-color: initial;
background-color: unset;

浏览器支持

IE浏览器 火狐浏览器 opera浏览器 chrome浏览器 safari浏览器
浏览器都支持 background-color

语法:

background-color transparent | <color>

取值

  • <color> :一个描述背景统一颜色的CSS <color> 值。
  • 当同时定义了背景颜色和背景图像时,背景图像覆盖在背景颜色之上。
  • 即使一个或几个的 background-image 被定义,如果图像是不透明的,通过透明度该颜色也能影响到渲染。
  • 在 CSS 中, transparent 是一种颜色。
  • 对应的脚本特性为 backgroundColor
默认值 transparent
适用于 所有元素
继承性
动画性
计算值 指定值

例子

//HTML
<div class="exampleone">
 lorem ipsum dolor sit amet, consectetuer
</div>

<div class="exampletwo">
  lorem ipsum dolor sit amet, consectetuer
</div>

<div class="examplethree">
  lorem ipsum dolor sit amet, consectetuer
</div>

//CSS
.exampleone {
  background-color: teal;
  color: white;
}

.exampletwo {
  background-color: rgb(153,102,153);
  color: rgb(255,255,204);
}

.examplethree {
  background-color: #777799;
  color: #ffffff;
}