div组件作为按钮点击时显示小手样式

最近开发的时候发现用div来做按钮比直接使用el-button方便很多,调整样式也方便,但是如果直接使用div做按钮,鼠标放上面时只显示一个竖着的光标,很不美观,并且不会让用户知道可以点击

javascript 复制代码
<template>
  <div class="detail" @click="handleClick">详情</div>
</template>

<script>
export default {
  methods: {
    handleClick() {
      // 处理点击事件的逻辑

    }
  }
}
</script>

<style>
.detail{
  cursor: pointer;
}
</style>

++可以通过为div元素添加++++cursor属性++ ++来改变鼠标样式,使其在被点击时显示小手样式++

结果展示

相关推荐
MediaTea17 小时前
Jupyter Notebook:基于 Web 的交互式编程环境
前端·ide·人工智能·python·jupyter
少年阿闯~~17 小时前
CSS——重排和重绘
前端
个人看法17 小时前
h5实现一个吸附在键盘上的工具栏
前端·javascript·vue
知识分享小能手18 小时前
微信小程序入门学习教程,从入门到精通,微信小程序页面制作(2)
前端·javascript·学习·微信小程序·小程序·前端框架·notepad++
jason_yang18 小时前
JavaScript 风格指南 精选版
前端·javascript·代码规范
小高00718 小时前
🔍ECMAScript 2025 有哪些新特性?
前端·javascript
Hashan18 小时前
elpis-core:基于 Koa 的轻量级 Web 应用框架
前端·javascript·node.js
前端Hardy18 小时前
轻松搞定JavaScript数组方法,面试被问直接答!
前端·javascript·面试
云枫晖18 小时前
手写Promise-catch和finally
前端·javascript
薄雾晚晴19 小时前
大屏开发实战:封装自动判断、无缝衔接的文字滚动组件,告别文本截断烦恼
前端·javascript·vue.js