THE MOST IMPORTANT COMPONENTS OF CSS3 NECESSARY TO CREATE A MODERN WEBSITE

CSS3 colors units of measure selectors construction of responsive website html5 CSS3

CSS3 COLORS - the most important color determination systems

Hexadecimal notation CSS3

Webmasters usually write colors in hexadecimal notation.
Notation: # 6600FF - in fact it consists of three hexadecimal numbers, here 66, 00 and FF. They determine the amount of red, green and blue respectively. The RGB system works similarly - the final color is what will be created after mixing the components described by numbers.

SYSTEM RGB CSS3

RGB (red, green, blue) notation is used primarily in computer graphics programs and in some printers. The color consists of three numbers representing a percentage (0 - 100 percent) or numerically (0 - 255) the share of each color (red, green and blue). E.g. - text color - white - we will write:
color: rgb (100%, 100%, 100%); or color: rgb (255,255,255);
the RGB extension is RGBA, where the next value is added: the alpha channel, i.e. the level of color transparency. A value of 0 means total transparency and 1 means no transparency (i.e. nothing translates).
color: rgba (255,255,255, .25);
But beware! Older browsers do not support RGBA.

UNITS OF MEASURE CSS3 - the most important size determination systems

CSS3 PIXELS

The oldest and still the most popular size record. Unfortunately, it is not very suitable for responsive websites.
font-size: 12px;

UNIT em CSS3

The em unit is a reference to the basic font size. This means that 1 em corresponds to 100 percent (e.g., the standard font size for a given document).
font-size: 1em;

CSS3 PERCENTAGE VALUES

The best way to create dynamic website grids (although I can do it too). It determines the size of the element contained in a given block, i.e. it is the percentage share of the element in a given block.
font-size: 100%;
margin: 5%;
e.t.c.

BASIC CSS3 SELECTORS

The list of selectors can be found, among others at: https://www.w3schools.com/ for a list of full CSS references.
 

CSS3: Font

1. Size - selector {font-size: size}
2. Type - selector {font-family: type, type1, type2, ...}
3. Style - selector {font-style: style}

CSS3: Text

1. Color: - selector {color: color}
2. Decoration - selector {text-decoration: decoration}
3. Alignment - selector {text-align: alignment}

CSS3: Background

1. Color - {background-color: color}
2. Picture background - {background-image: url (image path)}
3. Repeat - {background-repeat: repeat}
repeat - background repeat in both directions (default)
repeat-x - background repeat only in the horizontal direction
repeat-y - background repeat only in the vertical direction
no-repeat - no background repeat (will be displayed as a single image)

CSS3: Margins

top right bottom left {margin: size size size size}
Size you must enter a specific value in units of length eg pixels.

CSS3: Internal padding

top right bottom left {padding: size size size size}
The size should be given a specific value in units of length, e.g. pixels.

CSS3: Border

1. Style - the {border-style: style} selector

Style - most commonly used:
hidden - hidden border
dashed -
dotted dashed line
- solid dotted line - solid inset line
- "frame"
outset - "button

2. Border thickness - {border: size} selector

Size should be given a specific value in units of length, e.g. pixels.

3. Border width - selector {border-width: width}

Width - examples:
thin - thin
medium border - medium
thick border - thick border
or a specific value in units of length

4. Border color - the {border-color: color} selector

We substitute the color for the color, e.g. in hexadecimal or in English.

See in the menu similar articles to: CSS3 colors units of measure selectors construction of the html5 CSS3 responsive page