发表于： 2018-12-06 13:28:35
4 801
今天完成的事情：
开始任务九，努力修改样式....
已经差不多完成，准备提交审核了
明天计划的事情：
继续对页面进行修改自适应
遇到的问题：
子元素使用float时父元素不能高度自适应
有两种方法可以解决
1.在父元素最后一个元素添加css clear:both
2.在父元素样式里加上overflow: hidden或者auto也可以
个人推荐第二种方法，比较方便也不用额外加多一个元素
媒体查询有时样式不对，后来发现是书写顺序的问题
应该按照顺序来填写样式
1、如果判断最小值(min-width)，那么就应该从小到大写
@media screen and (min-width: 320px)
@media screen and (min-width: 425px)
@media screen and (min-width: 768px)
2、如果判断最大值(max-width)，那么就应该从大到小写
@media screen and (max-width: 768px)
@media screen and (max-width: 425px)
@media screen and (max-width: 320px)
顺便在导航栏里学了下用bootstrap做一个下拉菜单
收获：
学会媒体查询的使用，子元素使用浮动时高度自适应，了解了响应式的布局
返回列表
评论