Question

HTML：

<ul style="list-style-type: none; margin: 0; padding: 0; overflow: hidden; background-color: #2370b4">
    <li style="float:left; display:block; text-align:center; padding:14px 16px; text-decoration:none"><a class="active" href="/home/" style="color:white">Home</a></li>
    <li style="float:left; display:block; text-align:center; padding:14px 16px; text-decoration:none"><a href="/search/" style="color:white">Search</a></li>
    <li style="float:left; display:block; text-align:center; padding:14px 16px; text-decoration:none"><a href="/upload/" style="color:white">Library</a></li>
    <li style="float:left; display:block; text-align:center; padding:14px 16px; text-decoration:none"><a href="/adddata/" style="color:white">Add Data</a></li>
    <li style="float:left; display:block; text-align:center; padding:14px 16px; text-decoration:none"><a href="#about" style="color:white">About</a></li>
    <li style="float:right; display:block; text-align:center; padding:14px 16px; text-decoration:none"><i>{{ username }}</i></li>
    <li style="float:right; display:block; text-align:center; padding:14px 16px; text-decoration:none"><a href="/logout/" style="color:white">Logout</a></li>
</ul>

这里有我的标签，并且当光标悬停在上方时，我想显示一些帮助文本，例如当光标悬停在“搜索”上时，它应显示“搜索问题和答案”。

Answer 1

如果对设计没有要求，我将使用title属性：

<li style="float:left; display:block; text-align:center; padding:14px 16px; text-decoration:none">
    <a href="/search/" style="color:white" title="Search questions and responses">
        Search
    </a>
</li>

Answer 2

使用HTML标记中的标题显示帮助。

Answer 3

只需在标签中添加如下title属性，帮助

当鼠标悬停在文本上时如何添加帮助文本？

3 个答案: