Today's lesson is how to use the div box model to make a basic effect page with polygonal rotation amplification.
650) this.width=650; "Src=" https://s4.51cto.com/wyfs02/M01/9C/9D/wKiom1lzPtniK8PSAAmaEzYHoXo141.png-wh_500x0-wm_ 3-wmp_4-s_2635602965.png "title=" after the completion of the rotation and amplification effects can not be truncated to get "alt=" Wkiom1lzptnik8psaamaezyhoxo141.png-wh_50 "/>
Requirements Analysis: 1, how polygons are generated; Use the Transform property in CSS3 to rotate elements
2. Use Background:rgba to set translucent properties
Problems encountered: 1, style picture can not be in the middle? The solution uses an adaptive layout to set the top left right buttom to zero margin margin set to auto.
2, how to solve the middle arrangement of four up and down five problems. Solution: The div box is arranged in a row of horizontal rows and then wrapped, so the arrangement should be 5 5 4. The solution is to add a certain pixel width to the front of the sixth box. In this way, only four boxes can be placed in the middle of a column.
650) this.width=650; "Src=" https://s1.51cto.com/wyfs02/M02/9C/9E/wKioL1lzQYiyF8PtAAjDKICnWiE326.png-wh_500x0-wm_ 3-wmp_4-s_211256599.png "title=" permutation question "alt=" wkiol1lzqyiyf8ptaajdkicnwie326.png-wh_50 "/>
650) this.width=650; "Src=" https://s2.51cto.com/wyfs02/M00/9C/9E/wKiom1lzQnHhkdfJAAUT4xR1QqA195.png-wh_500x0-wm_ 3-wmp_4-s_3901344399.png "title=" not suitable for rotation "alt=" wkiom1lzqnhhkdfjaaut4xr1qqa195.png-wh_50 "/>
650) this.width=650; "Src=" https://s1.51cto.com/wyfs02/M00/9C/9E/wKioL1lzQnOQn-piAAJnfjjyvGA566.png-wh_500x0-wm_ 3-wmp_4-s_3890112352.png "title=" picture cannot center the effect "alt=" wkiol1lzqnoqn-piaajnfjjyvga566.png-wh_50 "/>
Summer rookie Learn to remember---html/css