我有困难理解属性显示:inline-flex ;.
display:inline-flex之间有什么区别?和显示:flex ;?
display:inline-flex之间有什么区别?和显示:flex ;?
我试图垂直对齐ID包装器中的一些元素。这就是为什么我给属性显示:inline-flex;到此ID;因为ID包装器是flex容器。
但是介绍没有区别。我预计包装器ID中的所有内容都将以内联方式显示。
#wrapper { display: inline-flex; /*no difference to display:flex; */ }
<body> <div id="wrapper"> <header>header</header> <nav>nav</nav> <aside>aside</aside> <main>main</main> <footer>footer</footer> </div> </body>
有什么不同?
解决方法
display:inline-flex不会使弹性项目显示为内联。它使得flex容器显示为内联。这是display:inline-flex和display:flex之间的唯一区别。可以在display:inline-block和display:block和
pretty much any other display type that has an inline counterpart之间进行类似的比较。
对弹性项目的影响绝对没有区别; flex布局是相同的,不管flex容器是块级还是行内级。特别地,flex项本身总是表现为块级框(虽然它们具有一些inline-blocks的属性)。您不能内联显示flex项目;否则你实际上没有flex布局。不清楚“垂直对齐”是什么意思,或者为什么要直接显示内容,但我怀疑flexBox不是你想要完成的任何正确的工具。