1.平滑滚动
html {
scroll-behavior: smooth;
}
2.禁用textarea文本框调整大小
textarea.no-resize {
resize: none;
}
textarea.horizontal-resize {
resize: horizontal;
}
textarea.vertical-resize {
resize: vertical;
}
3.首字下沉
::first-letter {
font-size: 250%;
}
4.投影
img {
filter: drop-shadow(0 0 3px #000);
}
5.居中div元素
body {
display: grid;
place-items: center;
}
6.改变输入框光标的颜色
input {
caret-color: red;
}
7.禁止网页内容选中高亮
.no-highlight {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
8.限制输入框值的范围
input:in-range {
background: rgba(0, 255, 0, .25);
}
input:out-of-range {
background: rgba(255, 0, 0, .25);
}
9.图像叠加
.image-overlay img:only-of-type:nth-child(1) {
object-fit: cover;
opacity: .4;
}
后续有新的会持续更新滴，谢谢
