3

次のようなリストがあります。

<ul>
  <li>A</li>
  <li>B</li>
  <li>C</li>
  <li>D</li>
  <li>E</li>
  .... etc ....
</ul>

のように終わる代わりに

A
B
C
D
E
...

私はそれが次のような列になることを望みます:

A      B      C
D      E      F
G      H      I
....  etc  (ordered alphabetically)

サーバー側の言語でこれを行う必要がある場合、各列に 1 つずつ、3 つの配列を作成し、各項目をループして正しい列に配置するようなことを行いますが、それを行う簡単な方法はありますか? CSS3?

どうもありがとう!

4

4 に答える 4

2

私はあなたのために2つの方法があります:

  1. <table>列を持つために 使用します
  2. 要素に次の CSS を設定します。

li {
   width: 100px;
   float: left;
}
ul { width: 320px; }

于 2012-06-01T06:09:53.853 に答える
1

さまざまなオプションがあります。

  1. Multicolumn-Layout (atm ブラウザーでのサポートはあまり良くありません) -仕様
  2. -要素にfloat:leftand width:100%/<no of cols>(3 列 = 33%) を配置します。li
  3. 疑似要素の:nth-child(<no of cols>)viaの後にブレークを入れます。content
  4. 表形式のデータがある場合: テーブルを使用する
于 2012-06-01T07:19:24.417 に答える
1

これが適切かどうかはわかりませんが、デモフィドルを見てください

于 2012-06-01T06:15:36.347 に答える