微信开发中 ACCESS TOKEN 过期失效的解决方案详解
694
2022-09-08
布局解决方案
布局解决方案
两列布局
一列定宽，另一列自适应
直接上代码一看就懂
left right
不兼容ie6
更加完美的方案
left
right
right
2.float+overflow:hidden 这里用的overflow会触发一个叫做bfc模式，就是块级格式化上下文，这就会把这个盒子和外界隔离开来，不会让其他浮动影响到自己，(javascript:void(0)） 仔细看清楚浮动和bfc可以看这篇文章。
left
right
right
3.使用table
left right right 4.使用flex left right right flex是根据内容来进行调整，所以对性能有影响，所以只能做小范围的布局。 多列顶宽，一列自使用 还是上面的思路 left right right 上面这些就是做个演示，看清楚思路就行，具体效果需要靠实际项目实现 一列不定宽，一列自适应 1.使用float+overflow left right right ie6不可以 2.使用table left right right 3.使用flex left right right 在更多列的布局中，还是使用float就可以把第二列设置成第一列同样的样式。 多列等宽布局 1。 仔细看这幅图片这个公式 得到下面这个代码 1 2 3 4 5 2.使用table布局 1 2 3 4 5 3.使用flex 1 2 3 4 5 等高布局 1.使用table left right right 2.使用flex left right right 3.使用float left right right 兼容性较好，但是不是真正的等高，是伪登高，只是让他的背景看起来登高，并且做了截取。 全屏布局 1.使用position布局 先看效果图 下面是实现代码： 2.使用flex布局 以上的两种方案，就是实现定宽和定高的实现方案。如过是不定宽和不定高的话，只要把相应的值改为百分比就可以了。 还有一种是全部都自适应的情况 采用position是无法做到的因为top的值会随时影响其他的值，那么就只有使用flex解决了。 使用flex就只需要把定宽和定高的地方去掉就可以了 讲了这么多，总结起来，布局就是靠float和position和table加上很强大的flex但是性能和兼容是个问题，载加上相应的html结构就可以实现我们想要的任何布局了，并且要学会分解问题，这才是最重要的。
版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。
center top left right bottom top left right bottom top left right bottom
相关文章
发表评论
最近发表
推荐文章
热评文章
暂时没有评论，来抢沙发吧~