为了页面美观,最后一行元素要求呈现左对齐的效果。这种情况下,我们可以通过伪元素的方式去解决。 (1) 当每行为三列时,直接设置伪元素的宽度和子元素宽度一致(适用于 space-between) // index.less.flex-wrap{padding:20px;display: flex;flex-wrap: wrap;justify-content: space-between;// 相当于增加了一个子...
因为我们设置了justify-content为space-between,意思就是两边贴边 这时候我们可以给最外层p设置个伪元素,宽度和里面的p宽度一样就好了 只需要两行css就可以 .main:after { content: ""; width: 100px; } AI代码助手复制代码 这时候看效果 其实原理就是最后一个伪元素把他挤过来了 就算有9个也没影响,因为他的...
flex布局设置space-between(around)最后一行不左对齐问题 2019-12-05 19:05 −问题点:在微信小程序中或者网页布局中使用flex的设置justify-content为space-around或者space-between;发现最后一行不左对齐,而是两端对齐的方式 使用justify-content:space-between的布局方式如下图  当每行为三列时,直接设置伪元素的宽度和子元素宽度一致(适用于 space-between) // index.less.flex-wrap{padding:20px;display: flex;flex-wrap: wrap;justify-content: space-between;// 相当于增加了一个子...