
Note: As of CSS Colors Level 4, hsla() is an alias for hsl(). Functional notation: rgb(R G B)ĬSS Colors Level 4 adds support for space-separated values in the functional notation. A (alpha) can be a between 0 and 1, or a, where the number 1 corresponds to 100% (full opacity). R (red), G (green), and B (blue) can be either s or s, where the number 255 corresponds to 100%. For example, #0f38 is the same color as #00ff3388. Likewise, the four-digit RGB notation ( #RGBA) is a shorter version of the eight-digit form ( #RRGGBBAA). For example, #f09 is the same color as #ff0099. The three-digit notation ( #RGB) is a shorter version of the six-digit form ( #RRGGBB). R (red), G (green), B (blue), and A (alpha) are hexadecimal characters (0–9, A–F). For example, #ff0000 is equivalent to #ff0000ff. In browsers that implement the Level 4 standard, they accept the same parameters and behave the same way. Note: As of CSS Colors Level 4, rgba() is an alias for rgb(). CSS Colors Level 4 added the rebeccapurple keyword to honor web pioneer Eric Meyer.They are called the extended color keywords, the X11 colors, or the SVG colors.
Although various colors not in the specification (mostly adapted from the X11 colors list) were supported by early browsers, it wasn't until SVG 1.0 and CSS Colors Level 3 that they were formally defined.
CSS Level 1 only included 16 basic colors, called the VGA colors as they were taken from the set of displayable colors on VGA graphics cards. Note: The list of accepted keywords has undergone many changes during the evolution of CSS: Though many keywords have been adapted from X11, their RGB values may differ from the corresponding color on X11 systems since manufacturers sometimes tailor X11 colors to their specific hardware. Several keywords are aliases for each other:. The color keywords all represent plain, solid colors, without transparency. Unlike HTML, CSS will completely ignore unknown keywords. The other color keywords should only be used in CSS and SVG. HTML only recognizes the 16 basic color keywords found in CSS1, using a specific algorithm to convert unrecognized values (often to completely different colors). There are a few caveats to consider when using color keywords: Although the names more or less describes their respective colors, they are essentially artificial, without a strict rationale behind the names used. Each selector performs his own style formatting.Color keywords are case-insensitive identifiers that represent a specific color, such as red, blue, black, or lightseagreen. You can try the following example which uses multiple selectors. We can group them as given in the following example: Ĭomplete Example using Different Selectors: Suppose we want to apply blue color to the text under paragraph (p) & heading (h1) tags. To apply a style with id selector, write a hash (#) character, followed by the id of the element. First Assign an id to HTML tag using id attribute: Example:. The Id Selector is used to select elements based on the id attribute of an HTML element. Here we will use “p” as an Element selector: Let us check a simple example to change text color under paragraph tag. This selector is used to apply some style formatting to particular tag types. Sometimes we call it Tag or Type selector as well. The element selector finds elements based on the tag name. Type of CSS SelectorsĬSS Selectors can select HTML elements based on their tag name, class, id, and attribute. CSS Selectors are used to finding HTML elements to apply some style and formatting on them.