我有一個(gè)博客，在那里我使用GetYourGuide的會(huì)員鏈接。 特別是，我在本頁使用它: https://www.visitare.net/best-tours-in-bologna/

我通過Elementor的HTML小部件插入了affiliate小部件，它帶有一個(gè)非常煩人的H2標(biāo)題:

我試圖用CSS刪除它:

.title-banner {display:none;} 
.title-banner[data-v-48b40ecd] {display:none;}

而且我還用過！很重要，但是什么都沒用

這個(gè)問題在我每次使用這個(gè)附屬鏈接時(shí)都會(huì)重復(fù)，我不明白為什么GetYourGuide要插入一個(gè)應(yīng)該是基于博客的個(gè)人標(biāo)題。

在你開始閱讀這里之前，請閱讀我在OP的問題下的評(píng)論。

經(jīng)過一番思考后，作為最后的手段，可以用某種變通方法來完成。這只是一個(gè)想法，也許它會(huì)切中要害，特別是當(dāng)它涉及到移動(dòng)視圖時(shí)，它不再有意義。你只需要在那里做實(shí)驗(yàn)。

這到底是怎么回事？這個(gè)想法是把& ltiframe & gt在容器中，設(shè)置為position:absolute；并使用負(fù)值的margin-top將其向上拉一點(diǎn)。最后，我們還需要clip-path屬性來屏蔽它。注意:這是您需要為每個(gè)& ltiframe & gt，例如博洛尼亞的頂級(jí)景點(diǎn)、最佳美食之旅等。

為了更好地理解，這里有一個(gè)非常簡單的例子。灰色區(qū)域?qū)嶋H上是容器。當(dāng)然，它可以與& ltiframe & gt并且只是為了演示的目的而變大。另一方面，紅色區(qū)域應(yīng)該代表& ltiframe & gt。最后，Lorem Ipsum占位符文本只是表示任意內(nèi)容。對你來說，當(dāng)然，這是圖像。

我認(rèn)為把& ltiframe & gt然后使用Elementor從下面應(yīng)用CSS規(guī)則應(yīng)該是可能的。

.iframe-container {
    width: 480px;
    height: 300px;
    background: #ccc;
}

.iframe-dummy {
    padding: 10px;
    width: 460px;
    background: red;
}

.iframe-dummy h2 {
    margin: 0;
    text-align: center;
    color: white;
}

.iframe-dummy p {
    text-align: justify;
    color: white;
}

/* THE WORKAROUND CLASS (see AFTER example in HTML) */

.workaround {
    position: absolute;
    margin-top: -45px;
    clip-path: margin-box;
}

<h2>Before:</h2>
<div class="iframe-container">
    <div class="iframe-dummy">
        <h2>Annoying Title</h2>
        <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
    </div>
</div>
<h2>After:</h2>
<div class="iframe-container">
    <div class="iframe-dummy workaround">
        <h2>Annoying Title</h2>
        <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
    </div>
</div>

你不能在瀏覽器中這樣做。當(dāng)從不同于網(wǎng)頁的域加載iFrame時(shí)，對該iFrame的JavaScript訪問被阻止。CSS也是。你也許可以在你的HTML中篡改內(nèi)容安全政策元標(biāo)簽，但我對此表示懷疑。

不過，您可以使用Nodejs這樣的服務(wù)器來完成這項(xiàng)工作。使用Node的http模塊并加載/獲取所有這些小部件，然后使用jsdom獲得您想要的部件，并將其全部組裝到您的最終網(wǎng)頁中。

您可以每天或每小時(shí)運(yùn)行一次節(jié)點(diǎn)腳本，將您定制HTML(頁面)保存在磁盤上，并靜態(tài)地提供給它。