发表于: 2017-04-09 22:47:48
2 515
今天完成的事:写了下明天要讲的PPT,预习了taskl10,完成task10前期任务。
明天计划完成的事:继续task10.
遇到的问题:暂无。
收获:删格系统用起来很好用,而且它自带媒体查询,能够自动得进行响应式布局。
栅格类适用于与屏幕宽度大于或等于分界点大小的设备 , 并且针对小屏幕设备覆盖栅格类。 因此,在元素上应用任何.col-md-* 不存在,
也影响大屏幕设备。简单的说,可以在某列上设置多个.col-*-*,Bootstrap会根据屏幕或者视口,来自动的设置所占得列。
不过删格系统有时候会和自己写的媒体查询冲突,我自己并没有加了.text-right:center,然而栅格系统加了,所以导致混乱,根本原因在于没注意栅格系统的实质,所以在手机页面调试的时候再不一样的分辨率文字方位出现的地方也完全不一样。
栅格系统是用min-width定义的,为大于等于,而我们额外定义的媒体查询用的是max-width,为小于等于,刚好有一个768px的重合,导致最终样式混乱。
解决方法:
去除交集,自己定义媒体查询时,定义max-width:767px。
评论