- 博客(21)
- 收藏
- 关注
原创 综合案例注册,登录跳转主页面
indexlet li=document.querySelector('.xtx_navs li:first-child');let obj=JSON.parse(localStorage.getItem('data'));if(obj){ li.innerHTML=`< a href=" ">您好${obj.username}用户!`;}registerlet icon=document.querySelector('.icon-queren');icon.addEventL...
2022-06-06 11:47:55 226 1
原创 实现分页按钮的缩放效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><style> li{ float:left; width:30px; list-style:none; height:30px; border:1px solid red...
2022-05-31 09:09:27 97
原创 提交按钮模块案例
<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <title>注册页面</title> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="renderer" content="webkit"> &l...
2022-05-25 08:00:14 104
原创 盒子居中效果的案例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>盒子居中效果</title></head><style> div{ position:relative; width:600px; height:600px; background-color:...
2022-05-23 09:53:23 104
原创 利用2D旋转rotate设置效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>利用2...
2022-05-23 09:48:02 75
原创 验证用户名信息案例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <titl...
2022-05-20 08:45:19 273
原创 实现进度条的效果的案例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title&...
2022-05-16 08:20:10 72
原创 渲染学生信息案例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title&...
2022-05-14 12:07:21 84
原创 鼠标移动的天使的案例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>案例分...
2022-05-11 21:12:39 69
原创 随机点名的效果
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>随机...
2022-05-08 08:49:31 94
原创 实现盒子和文字阴影效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><style> .div1{ font-size: 100px; font-family: 华文行楷; color: #87dfeb; font...
2022-05-03 20:24:40 51
原创 实现短信倒计时的效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title&...
2022-04-26 11:11:05 117
原创 秒杀倒计时效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc...
2022-04-26 10:29:19 56
原创 实现点名效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>随...
2022-04-26 10:22:38 64
原创 网页设计布局
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>设计...
2022-04-16 11:44:46 82
原创 实现表格全选和取消全选功能
表格取消和全选功能<script>var j_cbAll=document.getElementById('j_cbAll'); var j_tbs=document.getElementById('j_tb').getElementsByTagName('input'); j_cbAll.onclick=function(){ for ( var i=0;i<j_tbs.length;i++){ ...
2022-04-10 15:28:51 260
原创 实现动态表格的效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title&...
2022-04-10 15:25:33 62
原创 百度首页效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc...
2022-04-07 10:24:36 67
原创 如何实现百度换肤的效果
<html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>百度换肤效果</title> ...
2022-04-06 22:52:31 109
原创 分时问候显示不同的图片
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metahttp-equiv="X-UA-Compatible"content="IE=edge"><metaname="viewport"content="width=device-width,initial-scale=1.0"><title>Doc...
2022-04-04 17:29:02 57
原创 点击按钮显示系统时间
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metahttp-equiv="X-UA-Compatible"content="IE=edge"><metaname="viewport"content="width=device-width,initial-scale=1.0"><title>Doc...
2022-04-04 17:14:41 178
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人