自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

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

indexlet li=document.querySelector('.xtx_navs li:first-child');let obj=JSON.parse(localStorage.getItem('data'));if(obj){ li.innerHTML=`<a href="#">您好${obj.username}用户!</a>`;}registerlet icon=document.querySelector('.icon-queren');i.

2022-05-28 12:12:08 1497

原创 实现分页按钮的缩放效果

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>实现分页按钮的缩放效果</title></head><style> li{ float:left; width:30px; list-style:none; height:30px; border:1px so.

2022-05-28 12:09:58 41

原创 提交按钮模块

<!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"> <link .

2022-05-24 09:41:32 96

原创 利用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-20 18:27:16 58

原创 盒子居中效果

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>盒子居中效果</title></head><style> div{ position:relative; width:600px; height:600px; background-color: red; } .

2022-05-20 10:57:05 115

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

<!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 10:10:02 92

原创 实现进度条效果

<!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-13 15:54:49 37

原创 渲染学生信息案例

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <link href="css/style.css" rel="stylesheet"></head><body><h1>新增学员</h1><div class="info".

2022-05-12 13:01:55 40

原创 跟随鼠标的天使

<!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>跟随鼠标的天使&l.

2022-05-11 20:30:08 35

原创 随机点名(拓展)

<!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-04 20:53:49 32

原创 实现盒子和文字的阴影效果

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><style> .div1{ font-size: 100px; font-family: 华文行楷; color:cyan; ...

2022-05-02 09:54:11 40

原创 实现发送短信倒计时的效果

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body> <input type="text" placeholder="输入手机号"> <input type="button" value="获取验证码"> <sc.

2022-04-24 22:13:48 85

原创 实现随机点名的效果

<!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 18:42:26 206

原创 倒计时效果

<!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-20 20:54: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-15 16:16:51 63

原创 动态生成表格

<!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-08 13:17:48 348

原创 表格全选-取消全选

<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>表格全选/取消全选</title> <style> * { padding: 0; margin: 0; } .wrap { .

2022-04-07 12:09:10 59

原创 利用div盒子实现仿百度首页的效果

<!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-07 10:06:28 112

原创 2.实现百度换肤效果

<!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-06 21:21:27 163

原创 1.操作元素对象

2022-04-06 21:18:05 351

原创 CSS样式基础

CSS样式基础(刘锦程)

2022-04-04 14:43:02 259

原创 分时间问候显示不同图片

分时间问候显示不同图片

2022-04-03 16:03:59 219

空空如也

空空如也

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

TA关注的人

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