Attilax Summary of new features of Atitti CSS3

Attilax Summary of new features of Atitti CSS3

Photo Glow Effect 2

Transparent gradient Effect 2

Text Stroke 2

Background Stretch 2

CSS3 selector (Selector) 4

@Font-face Characteristics 7

Word-wrap & Text-overflow Style 9

Word-wrap9

Text-overflow10

Text rendering (text-decoration) Stroke 12

CSS3 Multi-column layouts (multi-column layout) 13

Border and color (color, border) 14

CSS3 gradient effect (Gradient) 15

Linear gradient 15

Radial Gradient 16

CSS3 Shadow (Shadow) and reflection (Reflect) Effects 19

CSS3 Background Effect 21

CSS3 's Box Model 23

CSS3 's transitions, Transforms and Animation30

Transitions30

Transform31

Animation33

Photo Glow Effect

Text-shadow: #000 3px 0 0, #000 0 3px 0, #000 -3px 0 0, #000 0-3px 0;

You can set the glow effect on each side, which is tedious.

Transparent gradient effect

Background:radial-gradient (Circle, Rgba (230,251,12,1.00) 40%, Rgba (230,251,12,1.00), Rgba (230,251,12,0)); /* Standard Syntax */

Text Strokes

With the use of text rendering (text-decoration) strokes to do: Although the luminous effect is also possible, the single effect is poor

Background stretch

background-size:100% 100%;

CSS3 's transitions, Transforms and Animation30

Transitions30

Transition-property: Used to specify transition effects

Transform31

Animation33

