Question

下面给出的例子

 <div id="SocialMediaBadges">

    <a href="http://www.facebook.com/liftedattire">
        <img src="facebook.png"/>
    </a>
    <a href="http://www.twitter.com/liftedattire">
        <img src="twitter.png"/>
    </a>
    <a href="http://www.instagram.com/liftedattire">
        <img src="instagram.pdf"/>
    </a>

</div>

然后让css将它们与这样的东西对齐？我已经尝试过代码，但不幸的是，它没有用。我可以单独编码，但这看起来效率更高。

#SocialMediaBadges {
   float:left;
   width:120px;
   height:90px;
   margin:5px; 
}

Answer 1

试试这个：

#SocialMediaBadges img{
    float:left;
    width:120px;
    height:90px;
    margin:5px; 
}

<强> Working example

注意：如果要在元素中寻址元素，可以通过在css规则中附加元素来实现。

例如#id_name div p a将解决嵌套在p元素中的div元素内的所有链接，这些元素也嵌套在具有id = id_name的元素中

Answer 2

试试这个

#SocialMediaBadges a img{
    float:left;
    width:120px;
    height:90px;
    margin:5px; 
}

你也不能把pdf放在html <img src="instagram.pdf"/>

中

Answer 3

img可以嵌套在div中 the next HTML elements can be nested inside div element

你可以在div中组合多个图像

3 个答案: