Question

为什么在先前浮动的图像之后图像不清晰（即在下面）？

让我们说

 .floatclass {float:right}
 .clrclass {clear:right}

<img class="floatclass" src="logocss.gif" width="95" height="84">
<img class="clrclass" src="logocss.gif" width="95" height="84">

Answer 1

请检查以下代码

HTML代码

<img class="floatclass" src="http://www.clipartbest.com/cliparts/jTx/oX6/jTxoX6nXc.gif" width="95" height="84">
<img class="clrclass" src="http://orig06.deviantart.net/d56b/f/2011/210/7/f/mortal_kombat_logo_gif_2_by_artchell-d420krj.gif" width="95" height="84">

CSS代码

.floatclass {float:right; display: block;}
.clrclass {clear:right; display: block;}

Answer 2

这是因为图片是默认的display: inline;让它display: block;适合您。

img {
    display: block;
}

<强> Fiddle

漂浮和清晰的图像

2 个答案: