为什么 img 设置 float 后不会覆盖 - V2EX

Home Sign Up Sign In

Can I use?

› http://caniuse.com/

Less

› http://lesscss.org

Cool Libraries

› Bootstrap from Twitter

› Jetstrap

This topic created in 4036 days ago, the information mentioned may be changed or developed.

<html>
<head>
<style type="text/css">
.pf
{
float:left;
}
</style>
</head>

<body>
<div>
<img src="eg_smile.gif" />
<img class="pf" src="eg_smile.gif" />
</div>
</body>
</html>

问题是为什么第二个img不会覆盖在第一个上边呢，而是两个在一行并排着。

6 replies • 2015-07-08 11:50:21 +08:00

1

morethansean

Jul 8, 2015

……谁告诉你 float 是覆盖的意思

2

jjplay

Jul 8, 2015

你对行，块，浮动元素的概念还不太清晰，想覆盖现在用相对绝对定位吧，妥妥的，理解的问题慢慢来

3

ivito

OP

Jul 8, 2015

@morethansean @jjplay 对行还不太了解，如果是块浮动的话就会覆盖了吧

4

br00k

Jul 8, 2015

因为img是inline-block

5

66beta

Jul 8, 2015

换 position

6

jankan

Jul 8, 2015

float后的元素是优先排列，类似inline-block，其他不float的元素会占满这行后换行

About · Help · Advertise · Blog · API · FAQ · Solana · 893 Online Highest 6679 ·

Select Language

创意工作者们的社区

World is powered by solitude

VERSION: 3.9.8.5 · 32ms · UTC 22:07 · PVG 06:07 · LAX 15:07 · JFK 18:07
♥ Do have faith in what you're doing.