javascript - HTML 複数列選択リスト

Question

通常はhtmlリストが作成されますが、

<select size=6 name="sel" id="sel">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="4">5</option>
    <option value="4">6</option>
    <option value="4">7</option>
    <option value="4">8</option>
    <option value="4">9</option>
</select>

しかし、それは次のように表示されています、

1
2
3
4
5

代わりに、私はそれになりたいです、

1   2   3   4
5   6   7   8
9   .........

また

1   3   5   7
2   4   6   8

「プラグイン」や「jquery」などを使用せずに表示する方法.純粋なjavascript、html、cssの方法でやりたいだけです

.........

Answer 1

これは入力では不可能<select>です。開始するには、次のようなものを試してください: http://jsfiddle.net/spryno724/z67w9/5/

<ul>
  <li>
    <ul>
      <li>1</li>
      <li>2</li>
    </ul>
  </li>

  <li>
    <ul>
      <li class="selected">3</li>
      <li>4</li>
    </ul>
  </li>
</ul>

Answer 2

選択オプションのスタイルを変更する方法はありません。これはシステム コントロールです。css と html のようなものを描画する必要があります (または、提案されているように jquery などのライブラリを使用します)。

Answer 3

そのように選択をスタイルすることはできません。カスタム ウィジェットを作成するか、3 つの通常の選択を使用してバックエンドで結果をマージする必要があります。