course content

Course Content

Introduction to CSS Part II

Background in CSS 1/2Background in CSS 1/2

We can set a plain color, a gradient, or an image as the background in CSS. This can be done using the shorthand background property or with specific properties like background-color or background-image, but the gradient only gets applied using the background property.

In CSS, the background-color property is used to specify the background color of an element. The background color is the color that appears behind the element's content. It can be specified using any valid color value, such as a keyword, rgb value, hex value, hsl value, or rgba value.

Here is an example of how the background-color property can be used in a CSS rule to set the background color of the <body> element to white:

html

index.html

css

index.css

js

index.js

  • The background-color property can be used in conjunction with the background-image property to specify both a background color and a background image for an element. If both properties are specified, the background image will be layered on top of the background color;
  • It will only apply to the content area of an element. It will not apply to the padding or border of the element;
  • You cannot affect the transparency of an element using the background-color property. To make an element transparent, you can use the opacity property;
  • Child elements will inherit the background-color property unless they have their own background-color property specified;
  • The background-color property can be used in conjunction with gradients to create more complex background styles.

Everything was clear?

Section 2. Chapter 3