我的示例代码：
<!DOCTYPE HTML><HTML> <head> <Title>Tiles</Title> <style type="text/CSS"> #tiles { List-style: none; margin: 0px; } #tiles li { float: left; margin: 20px; wIDth: 300px; height: 200px; background-color: #dddddd; Font-size: 72px; text-align: center; vertical-align: mIDdle; } </style> </head> <body> <ul ID="tiles"> <li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li> </ul> </body></HTML> 输出是：
但是,我想要这个输出.
请给我垂直排序列表的代码.
解决方法 使用 CSS columns：( JSFiddle)ul { column-wIDth: 380px; -webkit-column-wIDth:380px; -moz-column-wIDth: 380px; height:440px;}#tiles { List-style: none; margin: 0px;}#tiles li { /* float: left; */ margin: 20px; wIDth: 300px; height: 200px; background-color: #dddddd; Font-size: 72px; text-align: center; vertical-align: mIDdle;} 请注意,这在IE≤9中不起作用.
总结以上是内存溢出为你收集整理的html – 如何在垂直排序列表？全部内容，希望文章能够帮你解决html – 如何在垂直排序列表？所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）