abstract:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <style> .flex { /* basic styling */&
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style> .flex { /* basic styling */ width: 350px; height: 200px; border: 1px solid #555; font: 14px Arial; /* flexbox setup */ display: flex; flex-direction: row; } .flex > div { flex: 1 1 auto; width: 30px; /* To make the transition work nicely. (Transitions to/from "width:auto" are buggy in Gecko and Webkit, at least. See http://bugzil.la/731886 for more info.) */ transition: width 0.7s ease-out; } /* colors */ .flex > div:nth-child(1){ background: #009246; } .flex > div:nth-child(2){ background: #F1F2F1; } .flex > div:nth-child(3){ background: #CE2B37; } .flex > div:hover { width: 200px; } </style> </head> <body> <p>Flexbox nuovo</p> <div> <div>uno</div> <div>due</div> <div>tre</div> </div> </body> </html> 弹性盒子
Correcting teacher:查无此人Correction time:2019-01-18 17:14:05
Teacher's summary:作业完成的很好。布局应该对你来说很简单了,继续加油