3种js+css实现移动设置底部固定菜单，极简方法
解开css中注释，共3种方式，推荐flex方法。<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="...
css3实现加载动画，边框跑马灯
<style> body{/*让body所有元素正居中*/ display:flex; justify-content:center;/*水平居中*/ align-items: center;/*垂直居中*/ height:100vh;/*不加高，无法垂直居中...
css3实现不断旋转动画加载，并弹性布局显示
<style> body{ background:#34495e; display:flex; justify-content:center; align-items:center; height:100vh; } .loading{ position:relative...
CSS3用hover实现百叶窗动画
<style> ul,li{margin:0;padding:0;} ul{ display:flex; margin:0 auto; width:960px; height:500px; outline:1px solid black;...
css3动画实现滚动字，类似航班信息，超出滚动，不超出不滚动
文字走马灯，手机的弹幕等等。js可以动态的计算宽度，但js做动画需要定时器，很不方便。其实就是里外容器对向滚动，滚动的值为里外容器宽度的差值，如果里容器与外容器等宽，那么差值就为0，视觉上是没有滚动的，就像第一条数据；如果里容器宽度比外容器宽，里容器向左滚动的距离比外容器向右滚动的距离大，就会形成滚...
纯js三组文字定时向上滚动特效代码
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta&nbs...
CSS中给背景图增加遮罩
CSS作为网页开发的重要组成部分，经常会用到遮罩层的效果，实现页面视觉上的突出和强调。那么，CSS怎样设置遮罩层呢？下面就来简单介绍一下。首先，要清楚遮罩层的定义。遮罩层是指在页面元素上添加一个半透明的罩子，使得页面元素之间的重叠效果。”遮”住页面上的元素。接下来，我们来看如何在CSS中实现遮罩层的...
8 种在 CSS 中隐藏元素的方法汇总
作为 Web 开发人员，我们经常遇到需要隐藏网页上的元素的情况。在本文中，我们将分享8 种在 CSS 中隐藏元素的方法，每种方法都有优点和注意事项。1.Opacity and Filter: Opacity隐藏元素最简单的方法之一是调整其不透明度。opacity 属性允许我们通过将其值设置为 0 来...
CSS头像的花式悬停效果
<html><head><style>img { --s:280px; /* image size */ --b:5px; /* border thic...
纸张撕裂动画效果，网站错误404页源码
一款挺好看的404页源码，可以改成自己想要的提示页<html> <head> <meta charset="UTF-8"> &nbs...