チェックボックス非表示

Question

<input type="checkbox”>チェックボックス

上記のように定義していてcssでdisplayをnoneで設定しているのですが、チェックボックスの□は消えるのですが、”チェックボックス”の文字は残ってしまっています。どのようにしたら文字も消せるのでしょうか？

Answer 1

一例ですが。

.checkbox_hidden {
    display: none;
}

<div>
 <span class="check">
  <label class="checkbox_hidden"><input type="checkbox" id="aaa" value="1">Aチェックボックス</label>
  <label><input type="checkbox" id="bbb" value="1">Bチェックボックス</label>
 </span>
</div>

Answer 2

さっきの質問の流れからだと手で消すしかないと思います。