CSS隐藏外部跨度并显示内部跨度 | CSS隐藏外部跨度并显示内部跨度

本文介绍了CSS隐藏外部跨度并显示内部跨度的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

<span class="price">as low as <span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>1,335.79</span></span>

在WooCommerce中工作我想隐藏包含在外部跨度中的低至

Working in WooCommerce I want to hide "as low as" which is contained in an outer span yet show the price which is contained within an inner span.

如果有人可以指导我如何做到这一点。

If someone could guide me as to how to do this.

感谢

推荐答案

您可以将 font-size 隐藏所有文本，然后以这种方式显示内部span文本：

You can modify the font-size value to hide all text and then show the inner span text this way:

.price {
  font-size: 0;
}
.price span {
  font-size: 18px;
}

<span class="price">
  as low as
  <span class="woocommerce-Price-amount amount">
    <span class="woocommerce-Price-currencySymbol">$</span>
     1,335.79
  </span>
</span>

这篇关于CSS隐藏外部跨度并显示内部跨度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！