Using Colors in CSS

-

Using Colors in CSS
Colors are specified using predefined color names, or RGB, HEX, HSL, RGBA, HSLA values.

CSS Color Names

In CSS, a color can be specified by using a color name:
Red, Blue, Green, Orange, Tomato, DodgerBlue, MediumSeaGreen, Gray, SlateBlue, Violet , LightGray etc.

CSS Background Color

You can set the background color for HTML elements:

Example

<h1 style="background-color:DodgerBlue;">Hello World</h1>
<p style="background-color:Tomato;">Lorem ipsum...</p>

CSS Text Color

You can set the color of text:

Example

<h1 style="color:Tomato;">Hello World</h1>
<p style="color:DodgerBlue;">Lorem ipsum...</p>
<p style="color:MediumSeaGreen;">Ut wisi enim...</p>

CSS Border Color

You can set the color of borders:

Example

<h1 style="border:2px solid red;">Hello World</h1>
<h1 style="border:2px solid brown;">Hello World</h1>
<h1 style="border:2px solid Violet;">Hello World</h1>

CSS Color Values

In CSS, colors can also be specified using RGB(Red, Green and Blue) values, HEX (Hexadecimal starts with '#')values, HSL(Hue, Saturation, Lightness) values, RGBA (RGB with Alpha which means opacity of colors it ranges from 0 to 1 )values, and HSLA values:
RGB Format - rgb(255, 99, 71)

Note: rgb(255,255,255) makes White and rgb(0,0,0) makes Black color

HEX Format - #ff6347
HSL Format - hsl(9, 100%, 64%)

Example

<h1 style="background-color:rgb(255, 99, 71);">...</h1>
<h1 style="background-color:#ff6347;">...</h1>
<h1 style="background-color:hsl(9, 100%, 64%);">...</h1>
<h1 style="background-color:rgba(255, 99, 71, 0.5);">...</h1>
<h1 style="background-color:hsla(9, 100%, 64%, 0.5);">...</h1>

HSL Value

In CSS, 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
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)
The alpha parameter is a number between 0.0 (fully transparent) and 1.0 (not transparent at all):
Experiment by mixing the HSLA values below:
hsla(0, 100%, 50%, 0.5)

Comments

Post a Comment

Most Popular Posts

Functions in Excel

-
Image
Functions in Excel 2013 A  function  is a  predefined formula  that performs calculations using specific values in a particular order. Excel includes many common functions that can be useful for quickly finding the  sum ,  average ,  count ,  maximum value , and  minimum value  for a range of cells. In order to use functions correctly, you'll need to understand the different  parts of a function  and how to create  arguments  to calculate values and cell references The parts of a function A function must be written a specific way,  called   syntax . The basic syntax for a function is the  equals sign (=) , the  function name  (SUM, for example), and one or more  arguments . Arguments contain the information you want to calculate. The function in the example below would add the values of the cell range A1:A20. Working with arguments Arguments can refer to both  individual cells  and  cell ranges  and must be enclosed within  parentheses . You can include one argumen
Read more

Mixed Supply and Composite Supply under GST

-
Mixed Supply and Composite Supply under GST Let us understand first the term   “supply” simply means all forms of supply of goods/ services. It is carried out during the course of business. There are two types of supplies under GST, Composite and Mixed. Both of these supplies help to determine the correct GST rate and provides uniform tax treatment under GST for such supplies. Bundled Supply A bundled supply means supply of goods and/or services in a combination. This concept was mainly found in service tax where a bundled service meant a combination of two or more services. Here are some ways to identify whether it is a naturally bundled(Composite) or mixed one them: 1.      If buyers mostly expect such services to be provided as a package, then the package will be treated as naturally bundled. For example, most business conventions look for combination of hotel accommodation, auditorium and food. 2. If most of the service providers in the industry provide a package o
Read more

Learn How to Create Company in Tally.ERP9

-
Image
Company Creation Tally.ERP9 Tally.ERP 9 is not a just an  accounting software  but its a complete ERP solution to business organisations such as managing Accounts, Inventory, Payroll and taxations (GST)   compatibility from version Tally.ERP 9 release 6. How to create a company in Tally.ERP 9? To create a company in Tally.ERP 9, Double Click on   tally icon on the desktop. Press Alt+F3 -> Create Company Details to be filled in company creation screen Directory The tally directory will store all data you entered in Tally ERP 9. By default, the data storage will be inside the installation folder. i.e. c:\users\public\tally.erp9\data Name In this field, we are required to type the name of the company, for example. XYZ INC. Primary mailing details Mailing name In this field, we are required to type the name of the company, for example. XYZ INC. Address In this data field, we are required to enter the address of the company. Country Here we
Read more