首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何在Bulma中创建一个可点击的图像,将mouseOver上的指针更改为< does>按钮?

如何在Bulma中创建一个可点击的图像,将mouseOver上的指针更改为< does>按钮?
EN

Stack Overflow用户
提问于 2019-03-17 22:54:18
回答 2查看 5.2K关注 0票数 7

爱牛马流。只是想让我的照片更明显,他们可以做的事情,当点击。

我可以用vue.js绑定样式,如

代码语言:javascript
复制
<figure class="image is-128x128">
<img v-bind:src="currentTrack.coverURL"   
@mouseover="hover = true" 
@mouseleave="hover = false"
@click="playAudio()" 
:style="hover ? {opacity:0.5} : {opacity:1}" alt=""/>
</figure>

但是鼠标指针并没有改变到可能帮助它看起来更像按钮的东西.想知道我是否可以添加一个简单的Bulma属性

提前谢谢!

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2019-03-24 21:18:06

适用于Bulma v0.9.1及更新版本

正如@Relisora所指出的那样,is-clickable现在使用Bulma的类本地船舶,因此不需要额外的CSS。

旧版本

不幸的是,Bulma目前还没有内置的课程。

但是,您可以轻松地为此创建一个类!要遵循Bulma约定,让我们将其称为is-clickable,并使用CSS定义它:

代码语言:javascript
复制
.is-clickable {
  cursor: pointer;
}

现在只需将类包含在<figure>-element中即可。

您可以阅读更多关于cursor-rule on MDN的内容。

票数 10
EN

Stack Overflow用户

发布于 2020-12-17 09:28:59

Bulma >= 0.9.1

使用Bulma类is-clickable

参考文献 - 提交

Bulma < 0.9.1

您必须自己添加CSS,下面是使用的代码符号:

代码语言:javascript
复制
.is-clickable {
  cursor: pointer !important;
}
票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/55212756

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档