是什么阻止了 margin 底部在这里发挥作用? http://jsfiddle.net/cq8VC/1/
我只是想让活跃的那个在空中跳跃大约 10px。
最佳答案
好的,通过在列表项的内部元素周围添加一个跨度,如下所示:
<div id="navigation">
<ul id="links">
<li><a href="index.html"><span>Home</span></a></li>
<li><a class="active" href="projects.html"><span>Projects</span></a></li>
<li><a href="whyme.html"><span>Why Me?</span></a></li>
<li><a href="contact.html"><span>Contact</span></a></li>
</ul>
</div>
通过将 CSS 更改为以下内容,您最终应该得到所需的结果:
#navigation ul#links li a.active{color:#1161A5; }
#navigation ul#links li a.active span { position: relative; top: -10px; }
#navigation ul#links li a{ font-family:LeagueGothicRegular;color:#ADC060;text-decoration:none;padding-left:10px;border-left:2px solid #1161A5;}
#navigation ul#links li a:hover,#navigation li:active{color:#1161A5;}
#navigation ul#links li:first-child a{border-left:none;}
#navigation ul#links li{float:left;font-size:1.5em;margin-left:10px;}
关于html - margin 底部不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3468517/