随笔分类 -  前端 合集

上一页 1 2 3 4 5 下一页
vue_实现轮播图
摘要：预览： 思路： 源码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Vuejs实现图片切换‘</title> <!-- 引入Vue开发版本的js --> <script src="https://cdn. 阅读全文
posted @ 2022-01-19 22:28 博客zhu虎康 阅读(158) 评论(0) 推荐(0)
前端_建材网
摘要：预览效果： 源码： index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>建材市场</title> <link rel="stylesheet" href="css/cssReset.css" 阅读全文
posted @ 2022-01-14 18:37 博客zhu虎康 阅读(45) 评论(0) 推荐(0)
前端_下拉选择
摘要：预览： 点击链接查看并下载相关10个优秀的 HTML5 & CSS3 下拉菜单制作教程：https://www.cnblogs.com/lhb25/p/10-html5-css3-drop-down-menus.html 阅读全文
posted @ 2022-01-12 21:14 博客zhu虎康 阅读(57) 评论(0) 推荐(0)
前端_nav左布局
摘要：预览 源码 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> <style> #header{ background-color:skyblue; color:white; text-align: 阅读全文
posted @ 2022-01-06 22:49 博客zhu虎康 阅读(86) 评论(0) 推荐(0)
前端项目_富文本编辑器
摘要：预览： 源码： <!DOCTYPE html> <html lang="en" xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <title>Title</title> <!-- <link rel="styles 阅读全文
posted @ 2021-12-22 21:33 博客zhu虎康 阅读(58) 评论(0) 推荐(0)
vue_toast提示信息
摘要：预览： 源码： <template> <div class="toast" v-show="show"> <div>{{message}}</div> </div> </template> <script> export default { name: "toast", props:{ messag 阅读全文
posted @ 2021-12-22 15:26 博客zhu虎康 阅读(119) 评论(0) 推荐(0)
前端项目_flex: 1; 的使用
摘要：预览效果： 源码演示： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> body{ margin:0; padding: 0; } .div1{ position: 阅读全文
posted @ 2021-12-21 21:15 博客zhu虎康 阅读(130) 评论(0) 推荐(0)
JS练习_时间Time的格式化
摘要：export function formatDate(data,fmt){ // 1.获取年份 // y+ 表示，1个多个y // y* 表示，0个或多个y // y? 表示，0个或者一个y // yyyy - 2019 , yy - 19 , y - 9 if (/(y+)/.test(fmt)) 阅读全文
posted @ 2021-12-13 20:31 博客zhu虎康 阅读(77) 评论(0) 推荐(0)
用media制作一个自适应的网页
摘要：预览效果： 源码演示： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1.0"/> <title>ada 阅读全文
posted @ 2021-12-13 10:36 博客zhu虎康 阅读(75) 评论(0) 推荐(0)
JS练习_对已知账号密码验证进行登录
摘要：预览效果： 源码演示： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Login</title> <script> function valid(){ var pwd1 = document.getElem 阅读全文
posted @ 2021-12-12 22:11 博客zhu虎康 阅读(691) 评论(0) 推荐(0)
思路_添加背景音乐
摘要：添加背景音乐 <!-- 音乐开始 --> <div style="display:none" ;class="music"> <audio controls="controls" autoplay="autoplay" loop=-1> <source src="../mp3/卡农.mp3" typ 阅读全文
posted @ 2021-12-11 20:49 博客zhu虎康 阅读(42) 评论(0) 推荐(0)
JS练习_登录验证
摘要：效果预览： 源码演示： login.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Login</title> <link rel="stylesheet" type="text/css" href 阅读全文
posted @ 2021-12-11 20:16 博客zhu虎康 阅读(158) 评论(0) 推荐(0)
JS练习_弹出登录框
摘要：效果： 源码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> .hide{ display: none; } .c1{ position: fixed; top: 阅读全文
posted @ 2021-12-10 14:27 博客zhu虎康 阅读(77) 评论(0) 推荐(0)
实现打字机效果
摘要：打字机效果 效果预览 源码演示 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="v 阅读全文
posted @ 2021-12-05 20:40 博客zhu虎康 阅读(143) 评论(0) 推荐(0)
JS练习_选项卡切换
摘要：预览： 源码： <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>实践题 - 选项卡</title> <style type="text/css"> /* 标签和文本结合区域效果制作： 1.用ul做分类标签 2 阅读全文
posted @ 2021-10-29 15:40 博客zhu虎康 阅读(73) 评论(0) 推荐(0)
JS练习_增删操作学生信息
摘要：制作一个表格，显示班级的学生信息。 要求： 鼠标移到不同行上时背景色改为色值为 #f2f2f2，移开鼠标时则恢复为原背景色 #fff 点击添加按钮，能动态在最后添加一行 点击删除按钮，则删除当前行 预览 源码： <!DOCTYPE html> <html> <head> <title> new do 阅读全文
posted @ 2021-10-29 15:15 博客zhu虎康 阅读(350) 评论(0) 推荐(0)
JS练习_跳转提示页面
摘要：制作一个跳转提示页面： 要求： 如果打开该页面后，如果不做任何操作则5秒后自动跳转到一个新的地址，如百度网主页。 如果点击“返回”按钮则返回前一个页面。 预览： <!DOCTYPE html> <html> <head> <title>浏览器对象</title> <meta http-equiv=" 阅读全文
posted @ 2021-10-29 14:18 博客zhu虎康 阅读(477) 评论(0) 推荐(0)
JS练习_实现计算器功能
摘要：预览： <!DOCTYPE html> <html> <head> <title> 事件</title> <script type="text/javascript"> function count(){ //获取第一个输入框的值 //获取第二个输入框的值 //获取选择框的值 //获取通过下拉框来选 阅读全文
posted @ 2021-10-29 10:48 博客zhu虎康 阅读(68) 评论(0) 推荐(0)

上一页 1 2 3 4 5 下一页