Javascript 从父元素隐藏某些内容，但在CSS中显示子元素

我在Wordpress Woocommerce网站上有以下代码，输出“从189.00英镑起”

我想把“从”这个词去掉。我相信一定有一种简单的方法可以使用类似

。price:pre{display:none；}

<p class="price">From: <span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">£</span>189.00</span></p>

起价：189.00英镑

理想情况下，使用CSS如何从代码中隐藏单词“From”？我对functions.php中的javascript持开放态度

---

由于Wordpress的限制性及其输出的代码，我无法编辑上面的代码段。我必须在CSS或函数中操作上述代码。php

您可以使用

字体大小

隐藏文本，然后覆盖子span元素，如下所示：

.price{
字体大小：0px；
}
.价格跨度{
字体大小：16px；
}

起价：189.00英镑

您可以使用

字体大小

隐藏文本，然后覆盖子span元素，如下所示：

.price{
字体大小：0px；
}
.价格跨度{
字体大小：16px；
}

起价：189.00英镑

像这样：

.price{display:none；}

来自：
£
189

像这样：

.price{display:none；}

来自：
£
189

更改html的格式

<p class="price"><span class="from">From:</span> <span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">£</span>189.00</span></p>

---

更改html的格式

<p class="price"><span class="from">From:</span> <span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">£</span>189.00</span></p>

---

既然已经说这是不可能的，那就看看吧。简短答复:

.price>.woocommerce-Price-amount
{
    visibility: visible;
}

.price
{
  visibility: hidden;
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
}

---

多亏了。

既然已经有人说这是不可能的，请看一看。简短答复:

.price>.woocommerce-Price-amount
{
    visibility: visible;
}

.price
{
  visibility: hidden;
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
}

---

感谢。

简短回答，答案中包含了无法进行简短回答的可能重复，无法进行@Anthony:的可能重复。谢谢。很好的解决方案，谢谢。谁说这不可能！感觉不像@Dryden Long的答案那么粗糙，但实际上他的答案在实践中稍微好一点，因为出于某种原因，我不得不在您的解决方案中添加一些填充，所以他的代码使用较少。我只是想说声谢谢。@Anthony:答案中包括了。谢谢。很好的解决方案，谢谢。谁说这不可能！感觉不像@Dryden Long的答案那么粗糙，但实际上他的答案在实践中稍微好一点，因为出于某种原因，我不得不在您的解决方案中添加一些填充，所以他的代码使用较少。我只是想说声谢谢。