流式布局思想
# 尽可能不去使用固定属性值
# 通过父级来获取相应的属性值
# /*view-width view-height*/
# 80vw;
# height: 60vh;
# background: orange;
# /*流式布局限制条件*/
# /*流式布局下宽度最大放大到800px,最小只能缩小到600px*/
# span {
# /*em=?px 父级字体的大小*/
# font-size: 2em;
# display: block;
# /*宽高em在自身设置字体大小后,值又会更改为相应大小*/
# /*eg:body:100px => 设置自身字体时em=100px*/
# /*自身设置字体大小为2em,自身字体大小为200px => width=2em的 em=200px*/
# /*结果自身宽度是400px*/
# 2em;
# /*rem= html字体的 大小*/
# height: 2em;
# /*自身非设置字体时使用em单位,em取值自身字体大小*/
# background: red;
# .sup {
# 200px;
# height: 200px;
# background: red;
# /*padding: 50px;*/
# }
# .sub {
# /*父级的content是提供给子级盒子利用的*/
# margin: 0 5px;
# border: 5px solid black;
# padding: 5px;
# /*auto<=100%*/
# auto;
# /*100%*/
# height: 50px;
# background: orange;
# }