html – 为什么line-height属性不适用于超链接？

概述这是超链接的html代码.我希望文本之间略有差距.例如,在“菜单”和“联系我们”之间.提前致谢. <div id="navbar"> <a class="fb" href="menu.html">Menu</a></br> <a href="ContactUs.html">Contact Us</a></br> <a href="About Us.html">About 这是超链接的HTML代码.我希望文本之间略有差距.例如,在“菜单”和“联系我们”之间.提前致谢.

<div ID="navbar">    <a  href="menu.HTML">Menu</a></br>    <a href="ContactUs.HTML">Contact Us</a></br>    <a href="About Us.HTML">About Us</a></br>    <a href="TC.HTML">Terms & Conditions</a></br>    <a href="jobs.HTML" target="_blank">Jobs</a></br>    <a href="order.HTML">Your Order</a></div>

我在CSS中设置了line-height属性,如下所示：

#navbar {  line-height:2em;}

解决方法 你应该在锚点中定义一个行高而不是在navbar ID中看到示例代码： –

HTML

<div ID="navbar"><a  href="menu.HTML">Menu</a></br><a href="ContactUs.HTML">Contact Us</a></br><a href="About Us.HTML">About Us</a></br><a href="TC.HTML">Terms & Conditions</a></br><a href="jobs.HTML" target="_blank">Jobs</a></br><a href="order.HTML">Your Order</a>

CSS

#navbar a {color: red;line-height: 33px;text-decoration: none;

}

http://jsfiddle.net/8LFLd/50/

另一个正确的方法是我在下面提到你应该在正确的ul li列表项目导航,如下所述： –

HTML

<div ID="navbar">  <ul>    <li><a  href="menu.HTML">Menu</a></li>    <li><a href="ContactUs.HTML">Contact Us</a></li>    <li><a href="About Us.HTML">About Us</a></li>    <li><a href="TC.HTML">Terms & Conditions</a></li>    <li><a href="jobs.HTML" target="_blank">Jobs</a></li>    <li><a href="order.HTML">Your Order</a></li>  </ul></div>

CSS

#navbar li {    display:block;    List-style-type:none;    line-height:25px;}#navbar li a {    text-decoration:none;    color:red;}#navbar li a.fb {    text-decoration:none;    color:green;}#navbar li a:hover {    text-decoration:none;    color:blue;}

演示： – http://jsfiddle.net/XZ9w7/3/

总结

以上是内存溢出为你收集整理的html – 为什么line-height属性不适用于超链接？全部内容，希望文章能够帮你解决html – 为什么line-height属性不适用于超链接？所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。