0

各ボックスには画像とテキストが含まれますが、ボックス全体にリンクが必要です。とにかく、リストは次のように水平です。

li{float:left;}

ビデオ1 | ビデオ2 | ビデオ3 | ビデオ4 |

ビデオ5 |

しかし、私のリストは2行になるので、次のようにしたいです:

ビデオ1 | ビデオ3 | ビデオ5 |

ビデオ2 | ビデオ4 |

どうすればいいですか？ここにデモがあります：http://jsfiddle.net/KjcKR/

テーブルで作成できることは知っていますが、最近ではテーブルはそれほど標準的ではないと言われました。そのため、リストで作成したいと考えています

4

3 に答える 3

3

列幅 http://jsfiddle.net/KjcKR/1/を使用できます

ul {
    width:800px;
    background-color:#900;
    list-style-type: none;
    -moz-column-width:190px;
    -webkit-column-width:190px;
    column-width:190px;
}
于 2013-06-23T22:37:19.030 に答える
2

ul最初の行に 3 つの要素のみを自動的に配置するように幅を変更するか、リストを 2 つのul要素に分割して adisplay: blockと awidthを 100% にして全幅にすることができます。

于 2013-06-23T22:34:49.617 に答える
1

CSS3 の複数列レイアウトを使用できます

ul {
    column-width: 380px;
    -webkit-column-width:380px;
    -moz-column-width: 380px;
    height:440px;
}

ただし、これは IE8 以前では機能しないことに注意してください。

http://jsfiddle.net/tutspack/8jw6r/

古いブラウザーでは、この JavaScript ポリフィルを使用できます - http://jsfiddle.net/gryzzly/Umz6a/

于 2013-06-23T22:39:43.293 に答える