要创建带有提示信息的工具提示元素，可以使用HTML的title属性。将title属性添加到任何元素中，当鼠标悬停在该元素上时，将显示一个工具提示框，其中包含添加到title属性中的文本。
以下是一个示例，其中将title属性添加到一个段落元素中：
<p title="这是一个提示信息">这是一个段落</p>当鼠标悬停在该段落上时，将显示一个工具提示框，其中包含文本“这是一个提示信息”。
如果要将工具提示元素定制为更具样式的元素，可以使用CSS来设置其外观。以下是一个示例，其中使用CSS样式将工具提示元素设置为黄色背景，蓝色边框和白色文本：
<style>
.tooltip {
position: relative;
display: inline-block;
border-bottom: 1px dotted blue;
}
.tooltip .tooltiptext {
visibility: hidden;
width: 120px;
background-color: yellow;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 5px 0;
/* Position the tooltip */
position: absolute;
z-index: 1;
bottom: 100%;
left: 50%;
margin-left: -60px;
}
.tooltip:hover .tooltiptext {
visibility: visible;
}
</style>
<p>
这是一个带有
<span class="tooltip">
工具提示
<span class="tooltiptext">提示信息</span>
</span>
的段落。
</p>此示例使用CSS样式将工具提示元素设置为一个带有黄色背景，蓝色边框和白色文本的元素。该工具提示元素是通过将提示文本包装在一个带有“.tooltiptext”类的span标记中来创建的。通过设置“.tooltiptext”的可见性，可以在鼠标悬停在带有“.tooltip”类的元素上时显示提示。
为了将关键字高亮，可以使用<mark>标签将其包裹起来，示例如下：
<p>
这是一个带有
<span class="tooltip">
工具提示
<span class="tooltiptext">提示信息</span>
</span>
的段落，其中包含<span><mark>关键字</mark></span>。
</p>这样，“关键字”将被高亮显示。
这是一个带有
工具提示
提示信息
的段落，其中包含关键字。