简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
前端 - flex布局采用space-around这种方法，但是最后一行如何让他左对齐？
黄舟
黄舟 2017-04-17 14:55:09
0
6
1213


如图最好那两个怎么让他左对齐？

黄舟
黄舟

人生最曼妙的风景，竟是内心的淡定与从容！

Antworte allen(6)
阿神
阿神2017-04-17 14:57:09 6 Etage

不用space-around,就使用的flex-start就可以， 注意加上flex-wrap:wrap

Wie +1
Antwort hinzufügen
黄舟
黄舟2017-04-17 14:57:09 5 Etage

楼主这种情况,我觉得用float布局比较好,如果还是用flex,同意楼上的说法.

Wie +0
Antwort hinzufügen
伊谢尔伦
伊谢尔伦2017-04-17 14:57:09 4 Etage

楼上说的对，这种直接百分比计算下就好了，没必要flex。
http://runjs.cn/code/3nq7qacp

Wie +0
Antwort hinzufügen
洪涛
洪涛2017-04-17 14:57:09 3 Etage

那我计算下。谢谢了

Wie +0
Antwort hinzufügen
刘奇
刘奇2017-04-17 14:57:09 2 Etage

如果每个item宽度相同的话，那么可以添加几个空白占位item，保持每行的列数相同即可

Wie +0
Antwort hinzufügen
黄舟
黄舟2017-04-17 14:57:09 1 Etage

flex 配合百分比使用。

  • 若 justify-content: space-around;，需要添加空白占位元素。

  • 若 justify-content: flex-start;，不需添加额外元素。

item 内部 text-align: center; 实现居中。

Wie +0
Antwort hinzufügen
Beliebte Themen
Mehr>
Populäre Artikel
Beliebte Tutorials
Mehr>
Verwandte Tutorials
Beliebte Empfehlungen
Aktuelle Kurse
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website：Online-PHP-Schulung für das Gemeinwohl，Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln！