Question

在使用Google网站翻译器测试我的网站时，我注意到Google正在更改我的网页的HTML结构，导致CSS样式无法应用。

例如，这段HTML（使用Bootstrap）：

<ul class="nav nav-pills nav-stacked">
    <li class="active">
        <a title="About us" href="/about/">About us</a>
    </li>
</ul>

更改为以下格式：

<ul class="nav nav-pills nav-stacked">
    <li class="active">
        <span class="notranslate" onmouseout="_tipoff()" onmouseover="_tipon(this)">
            <span class="google-src-text" style="direction: ltr; text-align: left">
                <a title="About us" href="...">Over ons</a>
            </span>
            <a title="About us" href="...">About us</a>
        </span>
    </li>
</ul>

基本上，我的链接被<SPAN>包裹着。我怎么能避免这种情况？

更新：

Google网站翻译也会删除SPANs周围的SVGs，即使这些元素不是链接。非常离奇。例如：

<div>
    <span>
        <svg>...</svg>
    </span>
</div>

变成了：

<div>
    <svg>...</svg>
</div>

Answer 1

这是Google翻译的原生方面。最好用一些CSS来修复任何破损。

Answer 2

我找到了一个修复程序，专门针对Google网站翻译，如下所示。

我改变了这个：

nav > li > a {
....
}

进入这个：

nav > li > a,
nav > li > span.notranslate > a {
...
}

谷歌网站翻译弄乱了HTML

2 个答案: