响应式开发从原理到实战案例(十二):响应式改版完整案例-文章列表

来源:互联网 发布:淘宝客有没有权重 编辑:程序博客网 时间:2024/06/06 07:38

响应式前


响应式后


实现的关键过程

第一步:整体布局媒体查询样式


底部填充40px

第二步:文章模块媒体查询样式


 宽度填充100%

第三步:侧边栏媒体查询样式



padding-left: 0px; 取消左填充的空间

width: 100%;//宽度填满整个父容器

 

 ~~~~~~~~~~~~~~~~~下一节《响应式改版完整案例-页脚》~~~~~~~~~~~~~~~~~



0 0
原创粉丝点击