首页 > web前端 > js教程 > 正文

如何将光标样式设置为没有 href 的链接的指针?

王林
发布: 2023-08-24 12:13:02
转载
565 人浏览过

如何将光标样式设置为没有 href 的链接的指针?

我们可以使用HTML中的标签来添加网页的链接。 元素的默认光标样式是指针,但从 标记中删除 href 属性会更改光标样式。

因此,在本教程中,我们将学习在没有 href 属性的情况下将光标样式保持为 标记的指针。

用户可以按照下面的示例查看元素的默认光标样式

示例

在下面的示例中,我们使用 标记创建三个不同的链接。

在输出中,我们可以观察到,当我们将鼠标悬停在第一个链接上时,光标变为指针,因为它包含 href 属性;对于第二个链接,光标也变成一个指针,因为它还包含一个带有空字符串值的 href 属性,当我们将鼠标悬停在第三个链接上时,光标样式会发生变化,因为它不包含 href 属性。

<html>
<body>
   <h2>Cursor pointer on the anchor texts</h2>
   <a href = "https://www.tutorialspoint.com/index.htm"> tutorialspoint</a>
   <br> <br>
   <a href = ""> Cursor pointer </a>
   <br> <br>
   <a> No cursor pointer </a>
</body>
</html>
登录后复制

现在,用户了解了当我们从 标记中删除 href 属性时光标样式如何变化。

下面,我们将看一下为没有 href 属性的链接设置光标指针的示例。

语法

用户可以按照下面的语法,使用 css 将光标指针设置为不带 href 属性的链接。

<style>
  .pointer {
     cursor: pointer;
   }
</style>
登录后复制

在上面的语法中,“pointer”是分配给 元素的类,我们更改了包含“pointer”类的元素的指针样式。

示例

在下面的示例中,我们创建了两个不同的 元素,并将“pointer”类分配给这两个元素。在 部分,我们添加了网页的内联样式。我们在