html - 在有下划线的段落中如何排除一系列单词被下划线(文本修饰无)

Question

在 Zurb Foundation 4 中，我想在下面的所有文本下划线，除了“Shipping International”，我已经尝试将各种 css 设置为文本装饰“无”，但我似乎无法弄清楚要解析的正确 CSS这是:

<div class="row">

 <p class="buy-button"><a href="#" class="medium button buy">Add to cart</a></p><br>
 <p class="small-font"><a href="#">usually leaves our warehouse in 1 business day.</a><br>
 <a href="#">Available for Pick Up NYC</a> <br>
 <span class="overview">Shipping: International</span> <a href="#">(See Terms &amp Conditions)</a> </p>
    </div>

我做了一个类的跨度，但它没有用。

可以在这个 fiddle 中看到 HTML 和 CSS http://jsfiddle.net/setbon/f8p62/

非常感谢任何解决问题的帮助。

Answer 1

从您的 .small-font 样式中删除 text-decoration:underline;。

这是完整的 CSS:

.medium.button.buy {
  background-color: green;
  /*  margin-right: 0.5em;
  margin-left: 0.5em;*/
  padding-left: 4em;
  padding-right: 4em;
}

.small-font {
  font-size: 0.75em;
}

.panel p.buy-button {
  margin-bottom: 0.1em;
}

还有 jsFiddle .