2

内部に同様のいくつかの要素を持つ水平フレックスボックスがあります。項目間のタブ移動を有効にするために、それぞれが でラップされます。埋め込み Webkit を使用しているため、達成しようとしている効果を確認するには Chrome が必要です。

アイテム間をタブで移動することはできますが、アイテムが画面の右側に離れすぎている場合は、そのアイテムをタブで表示したいと考えています。しかし、そうではありません。サンプルコードはここで見ることができます:

http://jsfiddle.net/sRGWS/

これを使用するもの：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Untitled Page</title>
    <style type="text/css">

.flexbox {
display: -webkit-box;
-webkit-box-orient: horizontal;
margin: 5px;
}

.item{
background-color: rgb(255,0,0);
width: 100px;
height: 100px;
margin: 5px;
}
</style>
</head>
<body>
   <div class="flexbox">
     <a href=""><div class="item"></div></a>
     <a href=""><div class="item"></div></a>
     <a href=""><div class="item"></div></a>
     <a href=""><div class="item"></div></a>
     <a href=""><div class="item"></div></a>
     <a href=""><div class="item"></div></a>
     <a href=""><div class="item"></div></a>
     <a href=""><div class="item"></div></a>
     <a href=""><div class="item"></div></a>
   </div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
</body>
</html>
4

0 に答える 0