0

当段落和img都浮动时，为什么只有段落的第一行出现在左侧，而图像下方的所有其他行？这里是代码..

    <!DOCTYPE html>
   <html>
    <head>
   <style>
    img,p 
   {
    float:left;
   }
  </style>
  </head>

<body>
 <img src="logocss.gif" width="95" height="84" />
 <p>
 This is some text. This is some text. This is some text.
 This is some text. This is some text. This is some text.
 This is some text. This is some text. This is some text.
 This is some text. This is some text. This is some text.
 This is some text. This is some text. This is some text.

 </p>

但是当只有 img 浮动时一切都很好，即所有文本都出现在左侧

4

1 回答 1

2

例子

试试这个代码：

<img src="logocss.gif" width="95" height="84" />
 <p style="width:300px;">
 This is some text. This is some text. This is some text.
 This is some text. This is some text. This is some text.
 This is some text. This is some text. This is some text.
 This is some text. This is some text. This is some text.
 This is some text. This is some text. This is some text.

 </p>​

您的代码不起作用，因为元素 p 没有宽度

如果浮动元素没有预定义的宽度，它将占用所需和可用的水平空间，而与浮动无关。注意：一些浏览器试图在未定义宽度时将元素放在浮动元素旁边 - 通常只给非浮动元素少量空间。所以你应该总是在浮动元素上定义一个宽度。

于 2012-12-27T10:04:26.857 回答