2024年10月22日
这个视频用CSS写一个非常简单的动态背景。大家可以看到在屏幕底部不断的有彩色的小泡泡升起来，而且是逐渐变大的，直到离开屏幕。来看一下代码，html非常简单。
·这些小泡泡用span来写，现在写了一些基本的样式，其它样式重新来写。来写一下这些小泡泡的样式，三个小圆出来了，再给这些小球加几层阴影，让它们看起来有点像气泡。
·接着来写个动画，让这些气泡从底部升起来。一开始把这些气泡移出屏幕的底部，这里给它100vh，并且一开始是比较小的，就让它变成0，再慢慢放大。动画结束的时候，气泡从顶部移出视口的范围，并且逐渐放大到原来的大小。绑定下动画，动画效果有了。
2024年10月22日
作者：Javan
转发链接：http://www.javanx.cn/20190321/css-skill/
随着前端开发越来越关注效率：通过选择器的使用和简化代码来快速加载渲染。像Less、SCSS这样的预处理器在工作的时候，需要绕的路较长，而直接使用css速度会更快。
2024年10月22日
在html页面制作中，可以利用 CSS 中的 transform 属性对图片进行旋转，缩放，移动或倾斜的操作。而今天我们只说说 transform 属性对图片进行等比例的缩放操作。
transform：该属性向元素应用 2D 或 3D 转换。它允许我们对元素进行旋转、缩放、移动或倾斜的操作。
缩放使用值：
scaleY(n)：对高度进行缩n倍的缩放
scaleX(n)：对宽度进行缩放，n指的是缩放比例
2024年10月22日
如果在Android浏览器中查看背景图片时出现模糊的问题，可以尝试以下几种解决方法：
1：使用高分辨率图片： 确保背景图片的分辨率足够高，以适应不同的设备屏幕密度。提供高分辨率的图片可以避免在高像素密度的设备上显示模糊。
2：使用适当的图片格式： 使用适当的图片格式，如JPEG、PNG或WebP。根据图片的特性和压缩需求选择合适的格式，以避免图片在浏览器中显示时失真或模糊。
2024年10月22日
在网站设计的世界里，CSS（层叠样式表）扮演着至关重要的角色，它赋予了网页美观、风格和布局。本文将深入探讨CSS，提供一个全面的指南，帮助你掌握网站设计的时尚艺术。
什么是CSS？
CSS是一种样式表语言，用于描述网页的视觉呈现。它允许你控制元素的颜色、字体、大小、布局和其他风格属性。通过将样式与内容分离，CSS使网站设计变得更加灵活和高效。
2024年10月22日
你知道吗？其实网页中有很多种图片格式，例如网页中有一种图片格式叫做 PNG，或者有一种图片叫 JPEG，还有另外一个名字叫 JPEG。
网页中其实还有很多其他种图片的格式，比如 GIF，GIF 一般是用来表示动图的，而 AVIF 或者 WebP 这些格式可能大部分同学并没有在网页中过多的去关注过，甚至还有一些 SVG 或者 BMP 的图片也有，这些可能不是大多数同学所经常去关注的图片格式。
2024年10月22日
前言
“说到对图片进行处理，我们经常会想到PhotoShop这类的图像处理工具。作为前端开发者，我们经常会需要处理一些特效，例如根据不同的状态，让图标显示不同的颜色。或者是hover的时候，对图片的对比度，阴影进行处理。”
本文略长，请耐心阅读
你以为这些是经过PS软件处理出来的？不不不，纯粹的是用css写出来的，很神奇把。
强大的 CSS:filter
CSS滤镜（filter）属提供的图形特效，像模糊，锐化或元素变色。过滤器通常被用于调整图片，背景和边界的渲染。MDN
2024年10月22日
当今的网络中，页面加载速度是最重要的网站指标之一。即使是毫秒也会对用户体验、产品产生巨大影响，而缓慢的页面加载会轻易的的降低转化率。您可以采用许多工具和技术来加快网站速度。在本文中，我们将介绍可用于改善前端性能的最佳CSS优化技巧。
1.查找性能瓶颈
所有优化中最重要的事情是从全面诊断开始。幸运的是，有许多CSS诊断工具可以帮助您发现任何性能瓶颈。首先，您可以使用网络浏览器的DevTools检查资产加载的速度。在大多数浏览器中，您可以通过按F12按钮打开DevTools 。