-1

十分な画像があれば、私のコードは正常に動作します。スクロールして、すべて問題ありません。

ただし、イメージの結合された幅が親 div の幅よりも小さい場合、スクロールは行われず (想定どおり)、すべてのイメージが左に揃えられます。

それらを中央に揃えるにはどうすればよいですか？

これは簡単なことだと確信していますが、解決策が見つかりません。

誰かが助けてくれれば幸いです。

ありがとうカイ

このプラグイン用です: http://www.smoothdivscroll.com/

私のCSSは次のようになります

#makeMeScrollable
    {
        width:100%;
        height: 55px;
        position: relative;
        margin: 20px 0; 
    }
#makeMeScrollable div.scrollableArea img, #makeMeScrollable div.scrollableArea a
{
position: relative;
float: left;
margin: 0 10px;
padding: 0;

filter: url(stylesheets/filters.svg#grayscale); /* Firefox 3.5+ */ 
filter: gray; /* IE6-9 */ 
-webkit-filter: grayscale(1); /* Google Chrome & Safari 6+ */

/* If you don't want the images in the scroller to be selectable, try the following
    block of code. It's just a nice feature that prevent the images from
    accidentally becoming selected/inverted when the user interacts with the scroller. */
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;
}
#makeMeScrollable div.scrollableArea img:hover, #makeMeScrollable div.scrollableArea a:hover
{
filter: none; 
-webkit-filter: grayscale(0); 
}

そしてhtmlは次のとおりです。

<div id = "makeMeScrollable">
            <img src = "images/test.png"
               id = "1" />

            <img src = "images/test2.png"
               id = "2" />
        </div>
4

2 に答える 2

0

margin:autoこれにより、ブロックレベルの要素が中央に配置されるため、画像を試してみてください。

于 2012-09-27T21:51:18.843 に答える
0

これを試して

<div style="display:table-cell; vertical-align:middle; text-align:center">
<img src="img.png">
</div>
于 2012-09-27T22:12:03.643 に答える