2023新CSS特性（上）

一分钟教你做出水波纹涟漪效果

通过 CSS 技术制作页面动态效果，如本例中的水波纹效果，展示了使用 DIV 元素及类选择器构建页面基础结构的方法。介绍了如何通过设置相对定位和绝对定位使元素居中显示，以及如何定义动画关键帧和应用 transition 属性来实现动画效果。演示了调整 opacity 属性来控制透明度，完成水波纹由中心向外扩散消散的视觉效果，并介绍了设置动画延时以实现连续动态效果。内容适合前端开发者、UI设计师、网页设计爱好者、动画效果制作人员、CSS学习者。

两分钟带你做出按钮的光晕效果

视频介绍了如何使用HTML和CSS结合JavaScript实现一个酷炫的按钮光晕效果。首先，通过在HTML中添加按钮并设置文本，接下来在CSS中通过相对与绝对定位配合transform属性，让光晕背景圆形居中。文字通过轻微定位覆盖在光晕之上。通过设置宽度和高度并与transition属性搭配，实现动态的过渡效果，使得光晕在鼠标悬停时平滑展现。JavaScript用于计算鼠标相对按钮的位置，并动态更新背景的位置，让光晕在鼠标周围移动。此技术适合前端开发者、UI/UX设计师、网站制作爱好者、JavaScript学习者以及对CSS动画感兴趣的人群。

一分钟教你做出文字触碰过渡下划效果

本视频展示了如何使用CSS为文字添加具有动态交互效果的背景。操作中首先设置了文本的行高来优化布局，随后引入了一个不重复的背景，并调整其位置至底部。为了实现过渡效果，进一步定义了背景的宽度和高度，使其在鼠标悬停时展开到全宽，鼠标移出时收缩。通过调整background-position在悬停和常态下的x位置，达到了背景位置动态变化的效果。此技术适合前端开发人员和UI设计师，帮助他们丰富网站界面的视觉体验和用户交互。

JS中居然存在相同方法？

视频中探讨了JavaScript（JS）编程语言中用于字符串处理的Trim方法及其变体。Trim是用来移除字符串首尾空格的常用功能，而Trim Left和Trim Right专门用于移除字符串左侧或右侧的空格。视频还提到了JS中trim start和trim end方法，它们实质上与trim left和trim right相同，基本可以视为别名。通过实例对比得知这些方法返回的结果一致。此视频适合对JS的细微差别感兴趣的开发者，以及希望深入理解JS字符串操作的程序员。

2个新单位教你搞定内容图片尺寸居中

视频通过两个CSS新单位vmin和vmax简化了内容图片在不同设备屏幕上的最大尺寸调整和居中问题。vmin基于视口宽度和高度中的较小值，而vmax则取较大值，这两个单位让开发者能够更灵活地进行响应式设计，尤其是在处理移动端的横屏与竖屏切换时。这些单位确保内容在各种尺寸的屏幕上都能正常显示，有助于提升用户体验。介绍的技术易于理解，横屏与竖屏适配的实用技巧适宜前端开发者和移动端设计师。

业务线做堆叠和堆叠线做堆叠的区别

交换机在机房中经常需要进行堆叠以增强网络性能和管理便捷性。堆叠可以通过两种方式实现：使用高速万兆业务板卡和光纤，或者专用的堆叠卡和堆叠线。两种方法在堆叠效果上并无显著差异。然而，由于机房布线时通常不预先布设堆叠线，以及光纤本身的物理特性（细软易布置），大多数用户倾向于选择光纤与万兆业务板卡进行堆叠。相反，堆叠线由于较粗硬且长度有限，再次布线时施工难度较大。这解释了用户在堆叠技术选择上的偏好。

JavaScript基础训练营 - 课程前瞻

针对JavaScript零基础学者，该课程旨在建立扎实的JavaScript基础，涉及前端行业必备知识。内容包括JavaScript历史、作用及实际应用，覆盖JavaScript作用域预解析、window对象、数据类型详解、以及DOM的关系与事件处理。课程设计注重从基础概念到代码实践的过渡，适合对前端开发抱有兴趣，意在此领域内打下坚实基础的初学者。

DIV元素到底支持多少种CSS样式？

此视频向观众展示了如何使用JavaScript来确定一个DIV元素可以支持多少种CSS样式。操作过程中，通过创建一个DIV元素并访问其style属性，可以查看所有可能的CSS样式。为了计数样式的数量，引入了一个变量，并通过循环迭代所有的样式来增加这个计数。这种方法揭示了DIV元素支持的CSS样式数量为604种。这个实用技巧不仅仅增加了对CSS和DOM的了解，还展示了基础的JavaScript编程操作，特别适合前端开发者和编程爱好者。