推荐关注
Meteor
JSLint - a JavaScript code quality tool
jsFiddle
D3.js
WebStorm
推荐书目
JavaScript 权威指南第 5 版
Closure: The Definitive Guide
waiaan

这种圆圈+文字的布局如何实现?

  •  
  •   waiaan · Aug 13, 2019 · 4210 views
    This topic created in 2514 days ago, the information mentioned may be changed or developed.

    不用 D3 等库,谢谢。

    avatar

    圆圈和文字的数量不固定。

    Supplement 1  ·  Aug 13, 2019
    图好像看不到,链接地址如下:

    https://www.17sucai.com/pins/34463.html
    8 replies    2019-08-16 15:55:49 +08:00
    waiaan
        2
    waiaan  
    OP
       Aug 13, 2019
    @jjplay 如果不引用第三方库,有什么思路吗?
    VDimos
        3
    VDimos  
       Aug 13, 2019 via Android
    Canvas 一把梭
    jjplay
        4
    jjplay  
       Aug 13, 2019
    就直接写个元素,border-radius 设为圆圈,display inline-block,让它自个儿靠左,谁超过父元素宽度了就自己换行
    waiaan
        5
    waiaan  
    OP
       Aug 13, 2019
    @jjplay 那不会导致左边一列都是对齐的?
    jjplay
        6
    jjplay  
       Aug 13, 2019
    那就居中对齐啊朋友,做开发就是要有灵活想法,尤其是前端 奇技淫巧待你去研究
    Zenyk
        7
    Zenyk  
       Aug 14, 2019
    flex 布局 配合 flex-wrap: wrap
    waiaan
        8
    waiaan  
    OP
       Aug 16, 2019
    @Zenyk
    @jjplay
    谢谢。
    不过这样元素排列不够紧致,会出现比较大的空隙。
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   5690 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 45ms · UTC 06:36 · PVG 14:36 · LAX 23:36 · JFK 02:36
    ♥ Do have faith in what you're doing.