使用方法：

1、head引入css文件

<!--地球圖標(biāo)-->
<link  rel="stylesheet">

<!--核心樣式-->
<link rel="stylesheet" href="css/style.css">

2、body引入HTML代碼

<div class="app-canvas">
  <div class="menubox" tabindex="0">
    <div class="menubox__label">
      <i class="material-icons">language</i>
      <span class="menubox__label-text">城市</span>
    </div>
    <div class="menubox__contents">
      <ul class="menubox__options">
        <li class="menubox__option">
          <label class="menubox__option-toggle">
            <input type="checkbox">
            <span class="menubox__option-label">上海</span>
            <span class="menubox__option-toggle-check"></span>
          </label>
        </li>
        <li class="menubox__option">
          <label class="menubox__option-toggle">
            <input type="checkbox">
            <span class="menubox__option-label">北京</span>
            <span class="menubox__option-toggle-check"></span>
          </label>
        </li>
        <li class="menubox__option">
          <label class="menubox__option-toggle">
            <input type="checkbox">
            <span class="menubox__option-label">廣州</span>
            <span class="menubox__option-toggle-check"></span>
          </label>
        </li>
        <li class="menubox__option">
          <label class="menubox__option-toggle">
            <input type="checkbox">
            <span class="menubox__option-label">武漢</span>
            <span class="menubox__option-toggle-check"></span>
          </label>
        </li>
        <li class="menubox__option">
          <label class="menubox__option-toggle">
            <input type="checkbox">
            <span class="menubox__option-label">湖南</span>
            <span class="menubox__option-toggle-check"></span>
          </label>
        </li>
        <li class="menubox__option">
          <label class="menubox__option-toggle">
            <input type="checkbox">
            <span class="menubox__option-label">濟(jì)南</span>
            <span class="menubox__option-toggle-check"></span>
          </label>
        </li>
        <li class="menubox__option">
          <label class="menubox__option-toggle">
            <input type="checkbox">
            <span class="menubox__option-label">重慶</span>
            <span class="menubox__option-toggle-check"></span>
          </label>
        </li>
      </ul>
    </div>
  </div>
</div>

<script src="js/index.js"></script>