Shulou(Shulou.com)06/01 Report--

This article is to share with you about the new features of CSS3. The editor thinks it is very practical, so share it with you as a reference and follow the editor to have a look.

I. RGBA and transparency

RGBA is an extension of the RGB color model. In essence, an alpha channel is added to the set element, that is, in addition to the three colors of red, green and blue, a channel representing transparency is added, in which RGB values represent red, green, and blue, respectively, while alpha values range from 0 to 1 (one decimal place).

II. Background attribute

Background-image: sets the background image of the element.

Background-origin: specifies the location area of the background image.

Background-size: specify the size of the background image.

Background-repeat: sets whether and how to repeat the background image.

III. Word-wrap attribute

The word-wrap attribute allows long words or URL addresses to wrap to the next line.

Note: all major browsers support the word-wrap attribute.

Basic grammar:

Word-wrap:normal | break-word

IV. Text-shadow attribute

Text-shadow property: sets shadows to the text.

Text-shadow basic syntax:

Text-shadow:5px5px5px#FF0000

Parameters: horizontal shadow, vertical shadow, blur distance, shadow color

5. Font-face attribute

Font-face property: define your own font

In the new @ font-face rule, you must first define the name of the font (such as myFirstFont), and then point to the font file.

VI. Border-radius attribute

Border-radius property: is an abbreviated property that sets four border-*-radius properties.

Basic grammar:

Border-radius:1-4length |% / 1-4length |%

Note: this attribute allows you to add rounded borders to the element!

7. Border-image attribute

Border-image: define the picture as a border around the div element

Border-image basic syntax:

Border-image:url (border.png) 3030round

VIII. Box-shadow attribute

Box-shadow property: adds one or more shadows to the box. (box Shadow)

Box-shadow basic syntax:

Box-shadow:10px10px5px#888888

IX. Media enquiries

Media queries define two sets of css that use different properties when the size of the browser changes.

Thank you for reading! This is the end of this article on "what are the new features of CSS3". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, you can share it for more people to see!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.