一些实用却很少用到的css以及标签

1、p:first-letter
p标签里的第一个字设置样式

p:first-letter { font-size:200%; color:#8A2BE2; } <p>My best friend is Mickey.</p>

2、p:first-line
p标签里的设置第一行样式

3、:not（p）
设置非 p元素的所有元素的背景色

4、<hr>

---

被水平线分隔的标题和段落

5、CSS里的pointer-events属性
本文要说的pointer-events的风格更像JavaScript，它能够：

阻止用户的点击动作产生任何效果
阻止缺省鼠标指针的显示
阻止CSS里的hover和active状态的变化触发事件
阻止JavaScript点击动作触发的事件
一个CSS属性能做所有的这么多事情！

这个pointer-events属性有很多可以使用的属性值，但大部分都是针对SVG的：auto, none, visiblePainted*, visibleFill*, visibleStroke*, visible*, painted*, fill*, stroke*, all*, 以及 inherit。其中none值能阻止点击、状态变化和鼠标指针变化：

.disabled { pointer-events: none; }
一些需要注意的关于pointer-events的事项：

子元素可以声明pointer-events来解禁父元素的阻止鼠标事件限制。
如果你对一个元素设置了click事件监听器，然后你移除了pointer-events样式声明，或把它的值改变为auto，监听器会重新生效。基本上，监听器会遵守pointer-events的设定。

6、touch-action
CSS属性 touch-action 用于设置触摸屏用户如何操纵元素的区域(例如，浏览器内置的缩放功能)。

7、https://blog.csdn.net/shenxianhui1995/article/details/109113462
safe-area-inset-left：安全区域距离左边边界距离
safe-area-inset-right：安全区域距离右边边界距离
safe-area-inset-top：安全区域距离顶部边界距离
safe-area-inset-bottom：安全区域距离底部边界距离
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);

总结

以上是生活随笔为你收集整理的一些实用却很少用到的css以及标签的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。