Blogger Information
Blog 10
fans 0
comment 0
visits 7980
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
盒模型属性简写与em和rem区别
php还在初学
Original
714 people have browsed it
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6. <title>盒模型属性简写与em和rem区别</title>
  7. </head>
  8. <style>
  9. header {
  10. border: 1px solid red;
  11. background-color: burlywood;
  12. font: bolder 2em 微软雅黑;
  13. padding: 0.5em 1em 0.5em 1em;
  14. margin: 2em 3em 2em 3em;
  15. border-radius: 1em; /*此时1em为32px*/
  16. }
  17. footer {
  18. border: 1px solid red;
  19. background-color: burlywood;
  20. font: bolder 2em 微软雅黑;
  21. padding: 0.5em 1em 0.5em 1em;
  22. margin: 2em 3em 2em 3em;
  23. border-radius: 1rem; /*此时1rem为16px*/
  24. }
  25. </style>
  26. <body>
  27. <header>努力学习php中。。。</header>
  28. <footer>努力学习php中。。。</footer>
  29. </body>
  30. </html>

效果图:

Correcting teacher:天蓬老师天蓬老师

Correction status:qualified

Teacher's comments:这二者的区别, 有时还真傻傻不好分, 因为好多场景下表现形式是一样的
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post