1

好的，这就是我所拥有的..

         <section id = "main"><!--main section -->
            <h2> Latest Work... </h2>
            <section class="examples"><a href="#"><img src="images/eg.jpg" alt="example"></a> </section>
            <section class="examples"><a href="#"><img src="images/eg.jpg" alt="example"></a> </section>
        </section><!-- end of main section -->

好的，现在我不明白如何将这 3 个部分排成一行。我试过 display: inline-block; 等似乎没有任何效果。我需要定位css文件或img中的部分吗？或两者？帮助！哈哈谢谢 ：）

好的，我在您的帮助下设法做到了。我现在如何将它们居中？

4

4 回答 4

0

我认为你有一些无效的 html，改成这个

<section id = "main"><!--main section -->
            <h2> Latest Work... </h2>
            <span class="examples"><a href="#"><img src="images/eg.jpg" alt="example"></a> </span>
            <span class="examples"><a href="#"><img src="images/eg.jpg" alt="example"></a> </span>
        </section><!-- end of main section -->
于 2012-06-28T11:19:41.393 回答
0

最后，添加：

<br style="clear:both"/>
于 2012-06-28T11:19:56.303 回答
0

将此添加到您的 CSS 中。根据需要更改宽度 

 h2,.examples
    { {float:left;
    margin-left:10px}}
于 2012-06-28T11:20:14.853 回答
0

你可以尝试这样的事情：

​h2, .examples​ {
    float:left;
    margin: 10px;    
    display:block;
}​

你可以在这里看到它http://jsfiddle.net/Phenix/Mwtdb/

于 2012-06-28T11:20:26.073 回答