如何使新部分立即放在前一部分下方？

在本页面看看：http://codepen.io/abdulahhamzic/pen/WwgXRW 如何使新部分立即放在前一部分下方？

这里的HTML：

<!doctype html> 
<html> 
<head> 
</head> 
<body> 
<header> 
    <nav> 
    <ul> 
     <li><a href="#info">Info</a></li> 
     <li><a href="#portfolio">Portfolio</a></li> 
     <li><a href="#">Contact</a></li> 
    </ul> 
    </nav> 
</header> 
<section id="info"> 
    <p class="info"> 
    <br> 
    <br> 
    <br> 
    My name is Abdulah Hamzic. I am a beginner front-end web developer with not a lot of experience, but passionate about web-development and ready to learn new things everyday. I have completed the <a href="https://www.coursera.org/account/accomplishments/certificate/A5QYJS26WJ4E" target="_blank"><i>HTML, CSS and JavaScript</i></a> course by the Hong Kong University of Science and Technology and I'm currently doing the University of Michigan <a href="https://www.coursera.org/specializations/web-design" target="_blank"><i>Web Design for Everybody</i></a> specialization, plus the <a href="http://freecodecamp.com/" target="_blank">Free Code Camp</a> path. I haven't built many projects, but you can check some of my first pens here on CodePen below. 
    </p> 
    <img id="myself" src="https://scontent-fra3-1.cdninstagram.com/t51.2885-15/e15/10453774_522901187836495_1728850695_n.jpg"/> 
</section> 
<section id="portfolio"> 
    <h3>This is my portfolio: 
    </h3> 
    <img src=""> 
</section> 
</body> 
</html>

有没有一种方法，使第二部分（#portfolio）马上去上一节（#info）以下，且没有在导航栏所在页面的顶部？任何人都请帮忙！

来源

2016-04-26 Abdulah Hamzic

当然......不要使用'position：absolute'..simple。 –

我没有使用位置：绝对虽然 –

当然你做了... #info div。 –

只是不使用position:absolute就像Paulie_D说的。

下面是使用它的codepen：http://codepen.io/anon/pen/bpxaOg

来源

2016-04-26 11:24:07

感谢你也:) –

在这种情况下，虽然position:absolute是问题，引导你的是增加利润的标题

我建议你联系的一部分或者使用Bootstrap布局方法和类或覆盖标题边距

.h1, .h2, .h3, h1, h2, h3 { 
    margin-top: 0px; 
    margin-bottom: 0px; 
}

我会建议前者。

Codepen Demo

来源

2016-04-26 11:27:58

如何使新部分立即放在前一部分下方？

回答

相关问题