Heading

Colors in CSS are specified using predefined color names:
RGB
HEX
HSL
RGBS
HSLA values.

RGB basically means Red, Blue, Green. In CSS we can specify a color as RGB by:

The intensity of color ranges 0-255. 255-highest intensity and is a value of red. Value of Black is- (0,0,0). Value of White is- (255,255,255).

There is an extension of RGB, called RGBA where A stands for alpha which means opacity and its value range from 0.0-1.0.

Another way to specify colors in CSS using hexadecimal value in the form: #rrggbb. Here rr= red, gg= green, bb= blue are hexadecimal values ranging from 00-ff (same as 0-255 in RGB).

Red is set to highest value of #ff0000 because red is set to highest value of ff and the rest are set to lowest value of 0. #000000 is the value for Black. And for white it is- #ffffff.

CSS is known for styling text and background and more for a webpage. Text in CSS can be set as-
<h1 style="color: Red;">Hello World</h1>
<p style="color: Blue;">This is my third assignment. </p>
<p style="color: Orange";>By- Aastha Dwivedi </p>

The background color is set by using “background-color”.
Example- body{
background-color: gray;
}
The rest of the color properties of Text are applicable in Background color.

Following are CSS Background Properties- background-color- as explained in above section.
background-image- specifies an image to be used as background of page.
background-repeat- By default, CSS repeats the image used for the entire page so they don’t look strange.
The repetition can be specified as: Horizontal: repeat-x ; Vertical: repeat-y
background-attachment- Specifies whether the background image scrolls or stays fixed.
background-position- Specifies the position of image in the background.

CSS Border properties specifies the style, width and color of an element’s border. Border Styles specifies the kind of border to display.

It allows the following values-
1. dotted - Defines a dotted border
2. dashed - Defines a dashed border
3. solid - Defines a solid border
4. double - Defines a double border
5. groove - Defines a 3D grooved border. The effect depends on the border-color value
6. ridge - Defines a 3D ridged border. The effect depends on the border-color value
7. inset - Defines a 3D inset border. The effect depends on the border-color value
8. outset - Defines a 3D outset border. The effect depends on the border-color value
9. none - Defines no border
10. hidden - Defines a hidden border

CSS Gradients allows to display a smooth transition between two or more specified colors. CSS defines two types of gradients:
1. Linear Gradients.
2. Radial Gradients.

Linear Gradients- The transition goes down/up/left/right/diagonally. To create this, two color stops must be defined.
Syntax for the same is- background-image: linear-gradient(color stop1, color stop2…);

Radial Gradients- This is defined by its centre.
Syntax for the same is- background-image: radial-gradient(shape size at position, color stop1, color stop 2…)