What are the new features of CSS3? Detailed explanation of new features of CSS3

This article brings you what are the new features of CSS3? A detailed explanation of the new features of CSS3 has certain reference value. Friends in need can refer to it. I hope it will be helpful to you. [Recommended tutorial: CSS tutorial]

What are the new features of CSS3?

New selector p:nth-child(n){color: rgba(255, 0, 0, 0.75)}

Flexible box model display: flex;

Multiple column layout column-count: 5;

Media query @media (max-width: 480px) {.box: {column-count: 1;}}

Personality font-face{font-family:BorderWeb;src:url(BORDERW0.eot);}

Color transparency color: rgba(255, 0, 0, 0.75);

Rounded border-radius: 5px;

Gradient background: linear-gradient (red, green, blue);

Shadow box-shadow: 3px 3px 3px rgba (0, 64, 128, 0.3);

Reflection box-reflect: below 2px;

Text decoration text-stroke-color: red;

Text overflow text-overflow:ellipsis;

Background effect background-size: 100px 100px;

Border effect border-image:url（bt_blue.png） 0 10;

Transformation

Rotation transform: rotate (20deg);

Tilt transform: skew(150deg, -10deg);

Displacement transform:translate(20px, 20px);

Scale transform: scale(.5 );

Smooth transition transition: all .3s ease-in .1s;

Animation@keyframes anim-1 {50% {border-radius: 50%;}} animation: anim- 1 1s;

The above is the detailed content of What are the new features of CSS3? Detailed explanation of new features of CSS3. For more information, please follow other related articles on the PHP Chinese website!