html – 如何在CSS中浮动div？

概述我在 HTML中有这个列表,我想按列排序.我试过使用它给我的浮点数： 编辑： 这些< li>的高度是未定义的,但我想C以下B,E以下E和G在F以下,而不改变结构和改变顺序.我不想使用位置绝对.我想知道是否还有其他解决方案. HTML： <ul> <li class="item">A</li> <li class="item">B</li> <li class="item">C</ 我在 HTML中有这个列表,我想按列排序.我试过使用它给我的浮点数：

编辑：
这些< li>的高度是未定义的,但我想C以下B,E以下E和G在F以下,而不改变结构和改变顺序.我不想使用位置绝对.我想知道是否还有其他解决方案.

HTML：

<ul>   <li >A</li>   <li >B</li>   <li >C</li>   <li >D</li>   <li >E</li>   <li >F</li>   <li >G</li><ul>

OUTPUT(使用float：left; wIDth：240px; border-left：1px solID #EEE)：

我想要的更像下面这样,而不改变HTML,因为我已经使用这个结构做出响应.

可能吗 ？

解决方法 您可以在第一个li标签 like this上使用列CSS和margin-bottom.

ul {     column-count:4;     padding:0;     column-rule: solID lightgray 1px;}li {     display:inline-block;     wIDth:100%;}li:before {/* demo purpose to set an height to lis */     content:'';     float:left;     padding-top:50%;}li:first-of-type {     margin-bottom:50%;}

您可能需要一个JavaScript前缀或手动添加供应商前缀.

总结

以上是内存溢出为你收集整理的html – 如何在CSS中浮动div？全部内容，希望文章能够帮你解决html – 如何在CSS中浮动div？所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。