0

ソートされていないリストを「背景」として設定したい。そのために、幅2560pxを含め、ページを開く画面に一致するように、非常に幅を広くするように割り当てました。しかし、トリックか何かがない限り、CSSで完全に中心にすることはできません。私はjqueryの方法で進んで行きます。技術的には、ulはbackground-position：topcenterと同じ効果があります。

コードの代わりに、動作するはずの画像を添付します（追加されたコード）

<div style="background-color:black; width:100%; overflow:hidden; height:302px; text-align:center; position:relative">
<ul style="padding:0px; margin:0px; text-align:center; width:2560px; height:100%; margin:0 auto 0; position:relative;">
    <li class="image"></li><li class="image"></li><li class="image"></li><li class="image"></li><li class="image"></li><li class="image">

</ul>
</div>

私はインラインCSSを使用したので、私がやろうとしていることがより明確になりました。

ここに画像の説明を入力してください

助けていただければ幸いです

4

3 に答える 3

2

このフィドルはあなたが望むものですか？「背景」と言ったとき、あなたは正しく説明しなかったと思います

CSS

ul{
    list-style-type: none;
    margin: 0;
    position: relative;
    text-align: center;
    width: 100%;
    background:#FF0000;
}


ul li {
    display: inline-block;
    height: 65px;
    overflow: hidden;
    padding: 0;
    background:#0000FF;
    line-height:65px;
    color:#FFF;
    padding:0 5px;
}
于 2012-11-13T20:49:14.710 に答える
1

このようなことを達成しようとしていますか？

を の高さの半分の負の値に設定する限り、 を<ul>画面の中央に絶対に配置できます。たとえば、高さがの場合、 を画面の中央に垂直方向に完全に配置するには、を と一緒に設定する必要があります。top: 50%;margin-top<ul><ul>100pxmargin-top: -50px;top: 50%; position: absolute;<ul>

<ul>の高さが事前にわからない場合は、高さを決定し、それに応じて margin-top を調整する jQuery をいくつか追加しました。<div>jsFiddle でコンテナーの高さを変更して<ul>、コンテナーの高さに関係なく垂直方向に中央揃えになることを確認できます。

http://jsfiddle.net/kreCe/1/

于 2012-11-13T21:03:25.070 に答える
0

参考までに、解決策はdisplay:block-inlineにあります。：） ご助力いただきありがとうございます

于 2012-12-18T23:58:26.917 に答える