HOME | PHP Tutorial | CSS
facebook icon
PHP Tutorial

PHP forms
HTML Tutorial

CSS Tutorial

HTML colors, text, background and border color

HTML colors are used to give a specific web page design, highlight certain words or paragraphs, a proper contrast, etc.
HTML colors are specified using color name, RGB, HEX, HSL, RGBA and HSLA value.

HTML colors specified by name for background of item

HTML colors are specified using predefined color names as: LightGrey, Gold, Tomato, Orange, Blue, DodgerBlue, Green, MediumSeaGreen, Gray, Blue, SlateBlue, Violet, LightGray, Black etc. In the next example we give background color for div box.

Example 1:
<div style="height:100px; width:250px; color:#000000; background:Gold"> background color for this box it is Gold</div>
<div style="height:100px; width:250px; color:#000000; background:DodgerBlue"> background color for this box it is DodgerBlue </div>
Note: HTML colors supports 140 standard color names.

Text color and border color

You can set up text color inside box with different background color and differen border.
<h1 style="color:Brown;">Hello World. This text is brown color</h1>
<p style="color:DarkCyan; border:2px blak;">Hello World. This text is DarkCyan color with blak color border</p>
<div style="color:DarkRed;">Hello World. This text is DarkRed color inside div box</div>
2. External style for html div text color.
Example 3: named index.html and we add external file named style.css in Example 4.
<link rel="stylesheet" type="text/css" href="style.css">
<div>this box is background-color:red, blak border with FloralWhite color text</div>
Example 4 named style.css
color: FloralWhite ;
border:2px blak;

HTML Color Values

The HTML div style class attribute is used to define equal styles for item with the same class name.
So, all HTML div style class item with the same attribute will have the same format and style.
Here we have three HTML <div> class elements that point to the same class name:
Example 5:
<h1 style="background-color:rgb(255, 99, 71);">...</h1>
<h1 style="background-color:#ff6347;">...</h1>
<h1 style="background-color:hsl(9, 100%, 64%);">...</h1>
The result:

The same background color but in different RGB values

The same background color but in different RGB values and different text color

The same background color but in different RGB values with different text color

HTML colors, Text color, Border Color, background color HTML colors, background, text and border color - html tutorial

2117. HTML Tutorial - Hexadecimal, RGB color codes, inserting colors into html pages / safe colors
Hexadecimal colors and rgb colors. inserting colors

872. HTML colors - HTML tutorials - w3resource


3017. HTML
HTML tutorials, examples, and general words of wisdom!

2136. HTML Tutorial - Italic, blockquote, address
Italic text Italic, blockquote, address

2147. HTML Tutorial - Submit Buttons
Submit buttons.

3195. How to add text, paragraf in HTML, html tutorial
How to add text, paragraf in HTML html tutorial

Your add here
PHP strtolower() function

PHP lcfirst() function

PHP substr() function

PHP strip_tags() function

PHP trim() function

PHP wordwrap() function

PHP strstr() function

PHP htmlspecialchars() function

PHP ucfirst() function

PHP str_split() function

PHP isset() Function

PHP strtoupper() function

PHP print() function

PHP htmlspecialchars_decode() function

PHP strlen() function

PHP str_repeat() function

CSS Text Size
PHP Operator Types
Learn PHP online from the basic to the advanced
HTML link open in new tab or window - how to create link
HTML Text Style