Summary of color usage in html and css

In HTML, a color can be represented in the following three ways: color name, RGB value, or HEX value. In actual development, you can use color to do many things. You can also customize the effect of font color to achieve a gradient effect. You can also use css attributes to set various color effects you want for borders, fonts, images, etc. . This article mainly introduces how to use colors in HTML and CSS.

You can first learn free courses related to php Chinese website

1. Learn"Quick Start with HTML/CSS" Color and Classification Chapter Course

2. Watch "Dark Horse Programmer HTML Video Tutorial"中 Color code Video tutorial

##html, color usage in css

1.

htmlNumber values ​​of various common colors (collection)

In HTML, a color can be represented by color name, RGB value, or HEX value representation. RGB rgb (red, green, blue) three variables are the concentrations of the three primary colors (0~255). For example, rgb (255,0,0) red rgb (0,0,0) black rgb (255,255,255) white HEX hexadecimal represents sixteen Decimal system: 0~255 Conversion to hexadecimal system: 00~FF

2.

HTML5 learning while playing (4) - Changing colors

in Learn while playing with HTML5 (2) - In basic drawing, we mentioned that there are two contextual properties that can be used to set colors:

strokeStyle determines the color of the line you are currently drawing

fillStyle determines the color of the area you currently want to fill.

The color value can be a valid string that conforms to the CSS3 color value standard.

3.

Detailed explanation of CSS3 RGBA color mode usage example code

The RGBA color mode is an extension of the RGB color mode. It is added on the basis of the three primary colors of red, blue and green. Opacity parameter. The syntax is as follows:

rgba（r,g,b,）

where r,g,b represents the proportion of the three primary colors of red, blue, and green. The value can be an integer or a percentage. The positive integer value ranges from 0 to 255, and the percentage value ranges from 0.0% to 100.0%. Values ​​outside the range will be cut off to the nearest value limit. Note that not all browsers support using percentage values. The fourth parameter represents opacity, with a value between 0 and 1.

4.

css Gradient Color Omission Mark Embedded Font Text Shadow Detailed Introduction

CSS3 Gradient is divided into linear gradient (linear) and radial gradient (radial). Since different rendering engines have different syntax for implementing gradients, here we only analyze its usage based on the W3C standard syntax of linear gradients. You can refer to relevant information for the rest. W3C syntax has been supported by browsers such as IE10+, Firefox19.0+, Chrome26.0+ and Opera12.1+.

5.

High-Quality Web Design: Examples and Tips No. 6 (Utilizing the Full Potential of Color)

Summertime in Tennessee (Tennessee Summer Tour) is a Vibrant, bright and very warm site. Everything looks designed to promote summer activities. The site uses a wide range of highly saturated colors in varying hues, but each color hits the mark and none is inappropriate for the theme. The color combination of a high-quality design must be closely related to the service or product it is intended to present. Good design doesn't always require going to great lengths to choose some surprising colors. The colors that are most obvious and should be used can actually create better effects. For example, Hell Design (Hell Design), it is simply unreasonable not to use the fiery red color that symbolizes hell.

6.

CSS3 tutorial (3): border-color web page border color

Use the border-radius property of CSS3. If you set the width of the border to X px , then you can use X colors on this border, each color showing a width of 1px. If your border is 10 pixels wide, but only 5 or 6 colors are declared, the last color will be added to the remaining width.

Related Questions and Answers

1. The difference between the effects of opacity and rgba in the browser and the color transparency effects used in Android and iOS programs Very big.

2. Why is CSS3’s hsl color mode rarely used?

【Related recommendations】

1. PHP Chinese website free video tutorial: "php.cn Dugu Jiujian (2)-css video tutorial"

2. PHP Chinese website free tutorial: "Learn HTML+CSS at your fingertips"

The above is the detailed content of Summary of color usage in html and css. For more information, please follow other related articles on the PHP Chinese website!