- 博客(20)
- 收藏
- 关注
RSS订阅原创 实现综合案例的注册、登录和跳转到主页面
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>小兔鲜案例</title> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="renderer" content="webkit"> ...
2022-06-08 20:33:01
167
1
原创 实现分页按钮的缩放效果 (结合过渡属性)
<!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"> &l...
2022-05-29 15:47:00
85
原创 利用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&...
2022-05-25 12:23:04
127
原创 提交按钮模块
let form = document.querySelector('form') form.addEventListener('submit', function (e) { if (!verifyUsername()) { e.preventDefault() } if (!verifyPhone()) { e.preventDefault() } ...
2022-05-25 12:06:12
75
原创 利用2D转换的位移属性实现盒子居中效果
<!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"> <tit...
2022-05-19 16:08:45
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"> <tit...
2022-05-19 16:04:49
135
原创 实现进度条效果案例
<!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"> <tit...
2022-05-14 17:19:05
71
原创 渲染学生信息案例
<!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"> <tit...
2022-05-14 17:09:19
60
原创 图片跟随鼠标移动
<!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-11 13:41:20
54
原创 实现随机点名效果
<!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 15:32:51
77
原创 文字阴影与盒子阴影的对比效果
<!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-02 20:05:45
57
原创 实现随机点名的效果
<!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-27 18:27:12
98
原创 实现发送短信倒计时的效果
<!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-21 21:54:26
114
原创 完成秒杀/倒计时效果
<body> <div> <span class="hour">时</span> <span class="minute">分</span> <span class="second">秒</span> </div> <script> var hour=document.querySelec...
2022-04-20 21:30:11
60
原创 实现网页布局
<style>*{margin : 0;padding : 0;}li {list-style: none;}.top {height : 50px;background-color : gray ;}.banner {width : 980px;height : 150px;background-color : gray;margin : 10px auto;}.box {width : 980px;margin
2022-04-17 13:16:57
43
原创 实现动态生成表格
<body> <table cellspacing="0"> <thead> <tr> <th>角色</th> <th>法术</th> <th>法力</th> <th>操作</th&g...
2022-04-10 12:59:53
47
原创 实现表格全选和取消全选功能
<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++) {j_tbs[i].checked = this.checked; }...
2022-04-10 12:43:24
112
原创 实现百度换肤效果
<body><ul class="baidu"><li> <img src ="images/1.jpg"> </li><li> <img src ="images/2.jpg"> </li><li> <img src ="images/3.jpg"> </li><li> <img src ="images/4.jpg"> </
2022-04-07 17:04:24
63
原创 利用div盒子实现仿百度首页的效果
<body><div class="logo"> <img src="./im/bdlogo.gif" alt=""> </div><div class="nav"> <a href="#">新 闻</a> <strong>网 页</strong> <a href="#">贴 ...
2022-04-07 11:18:30
157
原创 分时问候显示不同图片
<!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-04-05 12:45:21
43
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人