分享css布局小技巧分享(新手必看)

1.max-width:

当页面左右宽度缩小时,为了避免出现左右滚动条的糟糕体验,就可以用到max-width啦!页面比宽度小时,会自动缩小哦~

2.box-sizing:

对元素设置box-sizing:border-box后,确定宽度后再设置padding和border,不会改变宽度。可以对全局设置,解决浏览器兼容问题的写法如下:

3.overflow:auto

边框自适应内容的大小,不会出现overflow的情况。

IE兼容方案:

4.响应式设计-媒体查询

运用媒体查询后,可以根据不同的页面宽度设置不同的布局,方法如下:

5.文字多列布局:

最后

“相信有很多想学前端的小伙伴,今年年初我花了一个月整理了一份最适合2018年学习的web前端干货,从最基础的HTML+CSS+JS到移动端HTML5等都有整理,送给每一位前端小伙伴,53763,1707这里是小白聚集地,欢迎初学和进阶中的小伙伴。”

祝大家早日学有所成,拿到满意offer,快速升职加薪,走上人生巅峰。

猜你喜欢

转载自blog.csdn.net/weixin_38004595/article/details/84296957