自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(18)
  • 收藏
  • 关注

原创 实现综合案例的注册(register)、登录(login)和跳转到主页面(index)的功能。

<!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-09 16:49:57 626 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-06-09 16:48:49 95

原创 案例实现: 利用2D旋转rotate设置旋转中心点

<style>div {overflow: hidden;width: 200px;height: 200px;border: 1px solid hotpink;margin: 10px;float: left;div: :beforecontent:“心愿";display: block;width: 100%;height: 100%;background-color:hotpink;transform: rotate(180deg)

2022-05-25 18:14:48 190

原创 完成正则案例需求八:提交按钮模块

// 需求八:提交按钮模块 // 使用 submit 提交事件 // 如果上面的每个模块,返回的是 false 则 阻止提交 // 如果没有勾选同意协议,则提示 需要勾选 // 在提交之前先验证 let form = document.querySelector('form') form.addEventListener('submit', function (e) { if (!verifyUs...

2022-05-23 16:51:06 176

原创 利用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"><title>利用...

2022-05-19 16:59:13 40

原创 验证用户名信息是否有效

<!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-18 21:55:17 60

原创 渲染学生信息案例

//console.log(arr);//重复渲染页面render();//复原原始表单 置为默认内容uname.value=age.value=salary.value='';gender.value='男';city.value='北京';});//删除数组中的数据 需要用到事件委托 事件对象etbody....

2022-05-17 09:55:23 146

原创 实现进度条效果案例

<!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-16 19:36:47 39

原创 完成图片跟随鼠标移动案例

<!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-05-10 16:29:28 49

原创 案例拓展: 实现随机点名的效果。

<!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 22:44:19 48

原创 分别利用 box-shadow 和 text-shadow 属性实现盒子阴影和文字阴影效果。

<!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 22:26:32 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"> <title&...

2022-04-22 11:59:40 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-04-22 11:57:43 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>Doc...

2022-04-16 14:11:19 74

原创 实现动态生成表格

<body> <table cellspacing="0"> <thead> <tr> <th>角色</th> <th>法术</th> <th>法力</th> <th>操作</th&g...

2022-04-10 13:06:34 61

原创 实现表格的全选和取消

<body> <div class="wrap"> <table> <thead> <tr> <th> <!-- 开始默认补选中 checked="checked" --> <input type="che...

2022-04-10 13:04:10 221

原创 百度换肤作业

<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"></li&gt

2022-04-07 11:21:03 49

原创 盒子模型作业

<body><div class=“logo”><img scr=“bdlogo.gif”/></div><div class=“nav”><a href=“#”>新闻</a>&nbsp;<strong>网页</strong>&nbsp;<a href=“#”>贴吧</a>&nbsp;<a href=“#”>知

2022-04-07 10:26:01 127

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除