0

基本的に、pic1の高さはpic2+pic3になります。

そして、すべてのpic1、2、3は同じブロックにあり、pic2とpic3およびpic1は同じ幅になります

左側がpic1、右側がpic2,3です。

動作しない私のコード...助けてください：

<div class ="row">

<span class ="row_1">
<img src="image/under.png" />
</span>

<span class ="row_2">
<img src="image/under.png" />
<img src="image/under.png" />

</span>
</div>

CSS：

.row_1 img {
display: inline-block;
width: 100px;
height: 100px;
}
.row_2 img {
display: inline-block;
width: 30px;
height: 30px;
}
4

1 に答える 1

1

私はこれがあなたが望むものだと信じています。W3C標準のブロックレベルの要素に準拠するために、インラインの要素内にネストすることはできませんが、インラインブロックではこれを行うことができます。注意すべき唯一のことは、インラインブロックの表示値は、特にIE7以下では、ブラウザーの下位互換性が完全ではないということです。

.row_1 img{
    width: 100px;
    height: 100px;
}

.row_2 img{
    width: 30px;
    height: 30px;
}

.row_1,
.row_2{
    display: inline-block;
}

.row_2 img{
    padding-top: 5px;
    display: block;
}

.row_2 img:first-child{
    padding: 0;
}
于 2012-04-16T16:56:25.557 に答える