JSTree在复选框之前删除左空间差距

Question

我将图标设置为false并且已经检查了CSS以快速解决此问题，但没有运气。我创建了一个示例，您可以看到每个复选框左侧都有大量空间。如果我删除了类=＆＃34; jstree-icon jstree-ocl＆＃34;从输出源中的li对象开始，它就会消失。有没有办法在主题选项中执行此操作？

＆＃13;

＆＃13;

$(function() {
  $("#YearContainer").jstree({
    "plugins": ["wholerow", "checkbox"],
    core: {
      "themes": {
        "icons": false,
        "dots": false,
        "responsive": false,
        "stripes": true
      }
    }
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/jstree.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/themes/default/style.min.css" />
<div id="YearContainer">
  <ul>
    <li>
      2010
      <ul>
        <li>
          2010A
        </li>
        <li>
          2010B
        </li>
      </ul </li>
      <li>
        2011
      </li>
      <li>
        2012
      </li>
      <li>
        2013
      </li>
      <li>
        2014
      </li>
      <li>
        2015
      </li>
  </ul>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

一个简单的解决方法就是将额外的图标空间设置为display:none，如下所示：

.jstree-node.jstree-leaf > .jstree-icon.jstree-ocl {
    display: none;
}

$(function() {
  $("#YearContainer").jstree({
    "plugins": ["wholerow", "checkbox"],
    core: {
      "themes": {
        "icons": false,
        "dots": false,
        "responsive": true,
        "stripes": true
      }
    }
  });
});

.jstree-node.jstree-leaf[aria-level="1"] > .jstree-icon.jstree-ocl {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/jstree.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/themes/default/style.min.css" />
<div id="YearContainer">
  <ul>
    <li>
      2010
      <ul>
        <li>
          2010A
        </li>
        <li>
          2010B
        </li>
      </ul </li>
      <li>
        2011
      </li>
      <li>
        2012
      </li>
      <li>
        2013
      </li>
      <li>
        2014
      </li>
      <li>
        2015
      </li>
  </ul>
</div>