CSS进阶：用户界面样式

目录

1. 含义

2. 鼠标样式cursor

3. 取消表单轮廓 outline

4. 防止表单域拖拽 resize

---

1. 含义

界面样式，就是更改用户操作样式，提高用户体验

1. 更改用户鼠标样式
2. 表单轮廓
3. 防止表单域拖拽

2. 鼠标样式cursor

设置或者检索在对象上移动的鼠标指针采用何种系统预定义的光标形状，通常配合JS使用

li {

cursor: pointer;

  }

属性值	说明
default	小白，默认
pointer	小手
move	移动
text	文本
not-allowed	禁止

3. 取消表单轮廓 outline

原来的：点击后

 当我们点击表单后会有一个表单轮廓，为了更好的美观网页，可以用outline取消表单域

给表单添加outer：0；或者outline：none；样式后，就可以去掉默认的蓝色边框

4. 防止表单域拖拽 resize

默认的文本域可以任意被用户放大缩小拉拽，为了更好的用户体验，使用resize防止表单域拖拽

在实际开发中，我们的文本域是不可以拖拽的

       textarea {

            resize: none;

        }

注意：textarea标签建议写在一行上，否则输入的表单域会有几个小空格显示

表单域在输入时也会有轮廓，所以防止表单域拖拽和取消文本域轮廓会一起设置