如何在 <a> 和 <p> 之间调整 space

Question

我正在尝试了解在 <a> 元素和 <p> 元素之间调整 space 的最佳方法。

这是我为此制作的 CodePen：http://codepen.io/theclarkofben/pen/jEVWgz

我只是专门调整红色和蓝色文本之间的 space。我不想调整蓝色段落文本之后或红色超链接文本之前的space。

到目前为止我玩过 line-height - 但是在蓝色之后调整 space 所以不合适。

我也玩过 -webkit-margin-before -webkit-margin-after 但关键是我正在寻找跨浏览器兼容的东西。

感谢您的宝贵时间和协助。

Answer 1

将 margin-top: 0;、margin-bottom:0; 和 padding-top:0; padding-bottom:0; 放入选择器 a,p

您可以通过调整这些值来调整space。

a {
  color:red;
  text-decoration:none;
}
p {
  color:blue;
  
}
a, p{
  padding-top:0;   /* Here is the code I added */
  padding-bottom:0;
  margin-top: 0;
  margin-bottom:0;
}

<h3>Blog Articles</h3>
        <a href="http://blog.hubspot.com/blog/tabid/6307/bid/6126/The-Ultimate-Glossary-120-Social-Media-Marketing-Terms-Explained.aspx">The Ultimate Social Media Glossary</a>
        <p>Found this and had to share</p>
        <h4>Influencer Outreach And Management - 5 Easy Tips</h4>
        <ul>
            <li>Looking for influencers shouldn’t be hard - find the ones that like you already</li>
            <li>Communicate openly, honestly, and frequently with your influencers</li>
            <li>Know their worth and treat them with respect</li>
            <li>Give some creative freedom - people believe people, not advertising</li>
            <li>Finally and very important - don’t leave them hanging. If you run a campaign with influencers, make sure you keep in touch afterwards and nurture the relationship.</li>
        </ul>

如何在 <a> 和 <p> 之间调整 space

How to adjust space in-between <a> and <p>

css

text

space