CSS3 front-end technology summary

--------------General Precautions----------------------

1. Web design should first clear the browser's default style

{

    padding: 0;

    margin:0;

}

 

--------------Field Styles-------------------------

1.text-shadow text shadow

2. border-radius rounded corners

3. border-image border image

4.box-shadow box shadow

5.first-line matches the first line of text

6.first-letter matches the first character

7.E[foo^="bar"] prefix

8.E[foo$="bar"] suffix

9. E[foo*="bar"] wildcard

10. E:nth-child(n)/(odd)/(even) matches the first/odd/even elements

11.table-layout table layout, the default is automatic, usually fixed

12.empty-cells Whether to hide the border and background of empty cells, the default is shou

13.border-collapse sets the merged border model for the table, it is recommended to collapse

14.E: enabled/disabled/checked style when not in use

15.list-style-type set different list styles

16.vertical-align defines the vertical alignment of the text

17.text-indent defines the indentation of the first line of text

18.line-height defines the text line height

19.font-stretch defines whether to stretch the deformed font horizontally

20.text-overflow defines how omitted text is handled

21.word-wrap defines whether to break the newline when the text exceeds the boundary

22.box-orient defines the flow layout direction inside the box

23.resize free zoom effect

24. Outline when the outline element is activated

25.content sets the content of the element

26.columns define multi-column layout

27.columns-gap border for multi-column layout

28.transform animation effect

29.rotate() rotation animation

30.scale() zoom animation

31.translate() moving animation

32.skew() tilt function

33.matrix() matrix deformation animation

34.transform-originCSS deformation origin, the default center point

35.transition-duration animation transition time

36. animation CSS animation

37.animation-name animation name

38. animation-duration animation time

39.animation-timing-function animation playback method

40. animation-delay animation start time

41. animation-iteration-count Number of animation plays

42.animation-direction animation playback direction

 

Guess you like

Origin http://10.200.1.11:23101/article/api/json?id=327039614&siteId=291194637