CSS 主要用于设置网页的视觉样式，包括布局、颜色、字体和其他设计细节。它使得网页设计与内容分离，从而提高了网页的可维护性和可重用性。 🌞 今天我将分享一些有用的 CSS 小技巧，后续不断完善，灵感不

在前端开发中，实现水平垂直居中在Flex布局下有一个更灵活的方式——使用 margin: auto;`来实现居中以及更多实际场景下的特定效果。

介绍一个CSS检测文本溢出的小技巧。 一直以来，CSS 都无法很好的检测出一段文本是否溢出。但这又是一个非常普遍的需求，比如多行文本展开，展开按钮只有在文本溢出的时候才出现 由于无法直接CSS判断，这

三行的时候省略（内容字数是不限的，内容文字是随机的），在内容末尾自动加上省略号，最后面增加展开按钮，并且希望展开和省略号之前有一定的间距。

在页面布局中，我们经常会遇到/使用这么一类常见的布局，也就是列表内容水平居中于容器中，像是这样： 效果如下： 这里，外层的容器是定宽的，内层的 flex-item 也是定宽的。 当 flex-item

分享一些个人整理的高质量的前端资源，减少初学者面对学习资源的信息差，保持输入的是流行和前沿的技术，资源不限于 知名开发者 / 博主，文档，视频，书籍，演示网站，工具。

如何通过 CSS 实现 小 'x' 的关闭样式, close icon实现。使用 CSS 动画优化显示效果。通过伪类的实现优化用户体验。还有纯JS实现方式哦。

遇到了一个「有趣」的小问题，iPhone 的 Safari 浏览器打开此页面试一下，以`iphoneX 15.0`以及`ios 13 15.4`的系统为例

有时候一些页面希望在手机上可以实现横屏的效果，比如播放页面，这样我们创建如下的css，这样在手机上浏览会发现页面处于横屏效果，而且即使开启了自动转屏，转屏后依然保持着横屏效果。