html禁止拖拽选择元素、鼠标右键

html禁止对元素拖拽、选择和鼠标右键操作，使得用户在浏览web页面时不能拖拽、右键图片，优化体验。 也可在文字标签上使用，使用户鼠标移入文字时，鼠标不变为选中状态（即鼠标样式变为：I）

1 禁止拖拽、鼠标右键

<img
	src="图片地址"
	class="unselectable"
	draggable="false"
	oncontextmenu="return false;"
 />

提示

其中class="unselectable"是添加一个名为unselectable的CSS类，draggable="false"为禁止拖拽，oncontextmenu="return false;"为禁止鼠标右键。

2 添加css属性禁止选中

<style>
	.unselectable {
	  -moz-user-select: -moz-none;
	  -khtml-user-select: none;
	  -webkit-user-select: none;
	  -o-user-select: none;
	  user-select: none;
	}
<style>

参考链接：https://blog.csdn.net/weixin_45066149/article/details/119520229

另外：Vue.js可在元素标签内添加@dragstart.prevent、@selectstart.prevent阻止拖拽、选择。

<img class="" src="" @dragstart.prevent />

<div class="" @selectstart.prevent>Copyright © 2021-2022 LIYITONGXUE</div>