当我将 svg 放入标签中时，悬停时标签标题不起作用 tool-tip

Question

我需要 网格视图 悬停 a 标记作为工具提示。

 <a href="javascript:;" title="Grid View">
   <svg width="24px" height="24px" viewBox="0 0 25 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
        <title>F97BF56E-2918-48BD-A2B7-2FA7C41F6C7F</title>
        <desc>Created with sketchtool.</desc>
        <g id="Asset-Artboard-Page" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
            <g id="atoms-/--/-view-grid" transform="translate(0.689655, 0.000000)" fill="#756280">
                <path d="M3,11 L11,11 L11,3 L3,3 M3,21 L11,21 L11,13 L3,13 M13,21 L21,21 L21,13 L13,13 M13,3 L13,11 L21,11 L21,3" id="grid-view-list"></path>
            </g>
        </g>
    </svg>   
</a>

Answer 1

将 svg 的 title 标签中的文本更改为 'Grid View'。

或者直接删除 title 标签。

像这样：

<a href="javascript:;" title="Grid View">
  <svg width="24px" height="24px" viewBox="0 0 25 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
        <desc>Created with sketchtool.</desc>
        <g id="Asset-Artboard-Page" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
            <g id="atoms-/--/-view-grid" transform="translate(0.689655, 0.000000)" fill="#756280">
                <path d="M3,11 L11,11 L11,3 L3,3 M3,21 L11,21 L11,13 L3,13 M13,21 L21,21 L21,13 L13,13 M13,3 L13,11 L21,11 L21,3" id="grid-view-list"></path>
            </g>
        </g>
    </svg>
</a>

当我将 svg 放入标签中时，悬停时标签标题不起作用 tool-tip

On hover a tag title is not working as tool-tip when i put svg inside a Tag

html

css

tooltip