logo标签列表

具有不同大小的div的网格布局（ul）

htmlcssgridhtml-lists
5
如何实现一个无序列表，使其看起来像这样？
  • Home
  • About
  • Services
  • Contact
你是否愿意接受 JavaScript 解决方案？ - Andres Ilich
1个回答
7
您可能想看一下jQuery Masonry。据我所知，这可能是实现此类布局最常用的工具。
谢谢你的推荐。我最近看了一下Masonry，它真的非常棒。然而，如果我没记错的话，Masonry是通过定义列宽来工作的。但是，根据我发布的示例，有相当多不同的宽度尺寸。但是，如果你知道任何使用Masonry实现这个的方法，请分享一下。 - JackArrgon
@JackArrgon 嗯，布局是固定的吗？我的意思是它是否总是看起来像你展示的那张图片？ - Chris
@JackArrgon 好的，这里有两个选择：大量使用 CSS 或者使用 <table>。如果你使用 table，那么从语义上来看它不太好，但更容易操作。你更喜欢哪个？ - Chris
我认为我已经找到了使用Masonry的解决方案。在网站上，它说：“项目元素的宽度可以跨越多个列。将columnWidth设置为与网格布局中列的宽度相匹配。”所以我要试一下这个方法。http://masonry.desandro.com/demos/basic-multi-column.html - JackArrgon
是的，使用Masonry和Isotope时，您需要选择列宽的最小公约数。但是，如果查看器的浏览器窗口不是很大且您的瓷砖大小很宽，有时会出现间隙，除非您进行一些聪明的排序。 - Systembolaget
显示剩余2条评论
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接