HTML Comments and Colors

HTML Comment :

A comment is a piece of code that is ignored by any web browser. It is a good practice to add comments into your HTML code, especially in complex documents, to indicate sections of a document, and any other notes to anyone looking at the code. Comments help you and others understand your code and increase code readability. HTML comments are placed in between <!– … –> tags. So, any content placed with-in <!– … –> tags will be treated as a comment and will be completely ignored by the browser.

Note:  Comments are not displayed by the browser, but they can help document your HTML source code. With comments you can place notifications and reminders in your HTML:

CODE:

Result:

HTML Colors:

HTML colors are specified using predefined color names, or RGB, HEX, HSL, RGBA, HSLA values.

CODE:

 

Result:

1. Background colors:

The background or bg-color attribute is used to control the background of an HTML element, specifically page body, and table backgrounds.

CODE:

 

Result:

2. Text Color:
You can set the color of the text:

CODE:

Result:

3. Border Color:
You can set the color of borders:

CODE:

 

Result:

4. Color Values:
In HTML, colors can also be specified using RGB values, HEX values, HSL values, RGBA values, and HSLA values:

CODE:

 

Result:

5. RGB Value:
In HTML, a color can be specified as an RGB value, using this formula:

RGB(red, green, blue). Each parameter (red, green, and blue) defines the intensity of the color between 0 and 255. For example, RGB(255, 0, 0) is displayed as red, because red is set to its highest value (255) and the others are set to 0.

To display black, set all color parameters to 0, like this: RGB(0, 0, 0).

To display white, set all color parameters to 255, like this: RGB(255, 255, 255).

CODE:

 

Result:

6. HEX Value :
In HTML, a color can be specified using a hexadecimal value in the form: #rrggbb

Where RR (red), gg (green) and bb (blue) are hexadecimal values between 00 and ff (same as decimal 0-255).  For example, #ff0000 is displayed as red, because red is set to its highest value (ff) and the others are set to the lowest value (00).

CODE:

Result:

 

7. HSL Value:
In HTML, a color can be specified using hue, saturation, and lightness (HSL) in the form:

HSL(hue, saturation, lightness). Hue is a degree on the color wheel from 0 to 360. 0 is red, 120 is green, and 240 is blue. Saturation is a percentage value, 0% means a shade of gray, and 100% is the full color. Lightness is also a percentage, 0% is black, 50% is neither light or dark, 100% is white

CODE:

 

Result:

8. Saturation:
Saturation can be described as the intensity of a color. 100% is pure color, with no shades of gray. 50% is 50% gray, but you can still see the color. 0% is completely gray, you can no longer see the color.

CODE:

 

Result:

9.Lightness:
The lightness of a color can be described as how much light you want to give the color, where 0% means no light (black), 50% means 50% light (neither dark nor light) 100% means full lightness (white).

CODE:

 

Result:

1O. RGBA Value:
RGBA color values are an extension of RGB color values with an alpha channel – which specifies the opacity for a color. An RGBA color value is specified with -RGBA(red, green, blue, alpha). An alpha parameter is a number between 0.0 (fully transparent) and 1.0 (not transparent at all):

CODE:

 

Result:

11. HSLA Value :
HSLA color values are an extension of HSL color values with an alpha channel – which specifies the opacity for a color. An HSLA color value is specified with:

HSLA(hue, saturation, lightness, alpha). An alpha parameter is a number between 0.0 (fully transparent) and 1.0 (not transparent at all).

CODE:

 

Result: