html中如何设置不可点击-木庄网络博客

2022-04-06 08:59:05 PHP中文网 JavaScript 百度已收录

本文摘自PHP中文网，作者青灯夜游，侵删。

在html中，可以利用pointer-events属性，通过设置元素的鼠标事件失效来实现元素不可点击效果，只需要给元素设置“pointer-events:none;”样式即可。

本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。

html设置不可点击

通过设置元素的pointer-events属性设置为none，来实现元素不可点击。此方法是通过设置元素的鼠标事件失效来实现元素不可点击。

css代码：

.disable {
    pointer-events: none;
}

示例：

const disabled = true;
<Button className={disabled ? 'disabled' : null}>点击</Button><style>
  .disabled {
      pointer-events: none;
      // 设置pointer-events: none;再设置cursor是没有效果的
  }</style>

效果图：

相关阅读 >>

“margin:0 atuo;”是什么意思？

Html中是如何引入css样式？以及link与@import的区别（代码实例）

Html标记中,表示网页标题的标记是什么

Html怎么转换成pdf

css怎么去掉按钮的边框

css如何清除下划线?css清除下划线有哪些方法

更多相关阅读请进入《Html》频道 >>

书籍

Vue.js 设计与实现基于Vue.js 3 深入解析Vue.js 设计细节

￥83.86元 人民邮电出版社

本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者

转载请注明出处：木庄网络博客 » html中如何设置不可点击

html中如何设置不可点击

Vue.js 设计与实现基于Vue.js 3 深入解析Vue.js 设计细节

相关推荐

评论