Question

使用Instagrams API在我的网站上显示图像时，图像不会继承包含div的样式。样式是浮动的：左。因此，它们不会叠加在一起，它们实际上出现在行和列中......而不仅仅是一列。

CSS：

#instagram.img {  
float:left;  
margin:10px;  
}

HTML / PHP（省略获取数据和解析）：

<div class="instagram">
<?php foreach ($result->data as $post): ?>  
<a class="group" rel="group1" href="<?= $post->images->standard_resolution->url ?>"><img src="<?= $post->images->thumbnail->url ?>"></a>
<?php endforeach ?>
</div>

我测试过，php外面的图像坚持造型而且他们这样做。他们漂浮：按预期离开。非常感谢任何帮助。

Answer 1

.instagram {  
float:left;  
margin:10px;
display: inline-block;  
}

正如我在评论中所说，#是id的选择器，.是类的选择器。

<div>
<?php foreach ($result->data as $post): ?>  
<a class="group instagram" rel="group1" href="<?= $post->images->standard_resolution->url ?>"><img     src="<?= $post->images->thumbnail->url ?>"></a>
<?php endforeach ?>
</div>

将.instagram课程添加到<a>，因为将其添加到您的div会使div向左浮动，而不是图片。

请参阅display properties，了解display: inline-block;。

的原因

PHP生成的图像不会继承包含div的样式

1 个答案: