共计 1082 个字符，预计需要花费 3 分钟才能阅读完成。
前端开发者是和用户最靠近的群体，所以前端开发须要具备用户视角。无论从页面布局、交互体验，还是（防偷防盗）都须要有权宜之计和制敌之策。上面记录一些我遇到的需要，以及实现过程。
替换鼠标光标
你是否想过替换浏览器本人渲染的鼠标，像上面的样子：
应用上面的 css 代码就能够实现：
/* 批改鼠标指针款式 */
body {cursor: url(../CSS/default.gif), pointer; /* default.cur 须要放在你我的项目目录下，*/
}禁止用户复制文字
<p onselectstart="return false">🈲复制 Lorem ipsum dolor sit, amet consectetur adipisicing elit. </p>
/** 或者 **/
<div style="user-select: none;">
CSS 属性 user-select 管制用户是否选中文本。除了文本框内，它对被载入为 chrome 的内容没有影响。Lorem ipsum dolor sit amet consectetur, adipisicing elit. Numquam at laboriosam aut. Accusamus tempore nisi laudantium pariatur. Quos, veniam dicta suscipit repellat amet delectus, deserunt sit laboriosam, ipsum quo dolores.
</div>当这行文字渲染到页面上，用户是无奈应用鼠标选中文字复制的。当然，只有他关上控制台，找到对应的 dom 还是能够轻松将其中的文字复制进去。
禁止用户右键
关上控制台的形式有常见两种，1. 右键 - 查看 2. 键盘快捷键 command+option+i。
如果，用户不晓得快捷键，那么咱们把右键点击禁用掉，他就无奈进入控制台复制文字了。如果他晓得快捷键，那你当我没说（囧）。
禁用右键代码：
// 能够加在某些元素上，如：<body oncontextmenu="return false">
<div class="wrapper">
<h3> 能够阻止普通用户的右键行为 </h3>
</div>
</body>
// 也能够加在整个 window 上：window.addEventListener('contextmenu', e => e.preventDefault())这样应用鼠标右键，就不会有任何反馈了。
自定义抉择文字款式
body::selection {
color:#FFFFFF;
background-color:#E84893;
text-shadow:none;
}演示
能够实现，下面的成果。
正文完