电脑上正常结果在手机上失败,是因为 flex 布局失效了吗?

电脑上正常结果在手机上失败,是因为 flex 布局失效了吗?

电脑上正常结果在手机上失败的原因

你在手机上布局出错的原因可能是由于 flex 属性的生效范围。你在 .cards 上设置了 flex,但它的作用范围只适用于 table 这个层级,而不会延伸到 tr td 层级。

在电脑端,你设置了 cellspacing="19px",导致 td 单元格间距为 19px,而不是 flex 属性生效所致。

而在移动端,td 未设置其宽度,默认占据 100% 的宽度。这导致 flex 属性无法生效,从而导致布局出错。

以上就是电脑上正常结果在手机上失败,是因为 flex 布局失效了吗?的详细内容,更多请关注其它相关文章!