利用Flex布局,仿写php中文网移动端首页
最终实现的运行图示如下:
作业总结:
1、在设置CSS过程中发现单独为某个div设置class=“themore”属性时,样式不起作用,后分析原因为:在其父级下所有的div 使用了.newbowen div 选择器,这个权重比单独为一个div设置class属性要高;
2、头部header和底部footer设置为fix固定定位,造成轮播图和底部的内容会陷入顶栏和底栏中,顶部轮播图可以通过设置margin-top>顶栏高度,或者为顶部和底部增加一个空的div把这个高度撑出来的方法解决;
3、了解了flex定位的特点,以及white-space: nowrap; overflow: hidden; text-overflow: ellipsis;文字超长截取的属性应用。
代码太长省略