发表于： 2017-03-28 21:05:01
1 672
今天完成的事情：
1、重做了一遍，但格式还是不对，和PS对不上，接着改。
字体用了相对于HTML的rem不过这样就不懂怎么做自适应了。
2、看了下bootstrap，就是一个格栅系统，默认分为12列。
2个要点：
第1个要点是容器（container），行（row）和列（column）之间的层级关系。
<div>
<div>
<div></div>
<div></div>
</div>
</div>
感觉就是table的格式写法
第2个要点，是不同的断点类型的意义及其搭配。
Bootstrap栅格的column对应的类名形如.col-xx-y。y是数字，表示该元素的宽度占据12列中的多少列。而xx只有特定的几个值可供选择，分别是xs、sm、md、lg，它们就是断点类型。
感觉就是自己在12列中做排列组合，什么元素用什么类型的，占几列。
别的还有Foundation栅格（了解），他写法是
<div>
<div class="medium-6 columns"></div>
<div class="medium-6 columns"></div>
</div>
明天计划的事情：接着改。
遇到的问题：用了rem的情况下怎么做自适应，头像图怎么调整白色背景和头像的相对位置。
收获：对不用table的td换了用li也可以做到在第二列中换行而不会跑到第一列去。就是设了个宽度。
返回列表
评论