项目的效果图

项目目录

│  index.html
│  server.js
│
├─css
│      main.css
│      reset.css
│
├─images
│  │  adv01.jpg
│  │  adv02.jpg
│  │  banner01.jpg
│  │  banner02.jpg
│  │  banner03.jpg
│  │  banner04.jpg
│  │  banner05.jpg
│  │  banner06.jpg
│  │  icons.png
│  │  logo.png
│  │  slide.jpg
│  │  slide02.jpg
│  │  slide03.jpg
│  │  slide04.jpg
│  │
│  └─goods
│          goods001.jpg
│          goods002.jpg
│          goods003.jpg
│          goods004.jpg
│          goods005.jpg
│          goods006.jpg
│          goods007.jpg
│          goods008.jpg
│          goods009.jpg
│          goods010.jpg
│          goods011.jpg
│          goods012.jpg
│          goods013.jpg
│          goods014.jpg
│          goods015.jpg
│          goods016.jpg
│          goods017.jpg
│          goods018.jpg
│          goods019.jpg
│          goods020.jpg
│          goods021.jpg
│
└─jsdate.jsdate.jsonjquery-1.12.4.jsjquery-1.12.4.min.jsslide.js

项目的准备

  1. 要有服务器的环境来做ajax
  2. slide.js:做幻灯片用的

项目代码

css

  1. main.css

    body{font-family: "Microsoft Yahei"font-size:14px;
    }/* 页面顶部的样式 */
    .header_con{/*块标签默认为父级的宽度*/height:29px;background-color: #f7f7f7;border-bottom: 1px solid #ddd;
    }/* 内容*/
    .header{width:1200px;height: 29px;margin:0px auto;/*background-color: gold;*//*margin:0px auto;*/
    }.welcome{font-size:12px;color:#666;line-height: 29px;
    }.user_con{/*background-color: gold;*/
    }/*默认将欢迎信息隐藏*/
    .user_info{display: none;font-size:12px;line-height:29px;color: #666;
    }.user_info em{color:#f80;
    }.login_btns li, .user_btns li{float:left;height: 29px;
    }.login_btns li a, .login_btns span, .user_btns a, .user_btns span{display: block;line-height:29px;font-size:12px;color:#666;
    }.login_btns span, .user_btns span{color:#cecece;margin:0px 10px;
    }/*响应事件*/
    .login_btns a:hover, .user_btns a:hover{color:#ff8800;
    }/* logo 搜索框  购物车 样式
    */
    .center_con{width:1200px;height:115px;margin:0px auto;/*background-color: gold;*/
    }/* logo */
    .logo{margin:29px 0px 0px 17px;
    }/*搜索框*/
    .search_con{width:616px;height:38px;/*background-color: gold;*/margin:34px 0px 0px 124px;border:1px solid #37ab40;background: url(../images/icons.png) 10px 6px no-repeat;
    }/*input输入框*/
    .search_con .input_txt{margin-left: 36px;width:480px;height: 38px;border:0px;/* 去掉input获取焦点时的框线*/outline: none;
    }/*搜索文字*/
    .search_con .input_sub{width:100px;height:38px;background-color:#37ab40;border:0px;  /*不要input的边框*/font-size:14px;color:#fff;cursor:pointer;  /*设置鼠标形状*/outline: none;
    }.search_con .input_sub:hover{color:#000;
    }/*购物车*/
    .chart_con{width:200px;height:40px;/*background-color: green;*/margin-top:34px;
    }.chart_link{width:158px;height:38px;border:1px solid #ddd;background:url(../images/icons.png) 15px -42px #f7f7f7 no-repeat;line-height: 38px;text-indent: 48px;color:#37ab40;}.chart_num{width:40px;height: 40px;background-color: #f80;text-align: center;line-height: 40px;color:#fff;font:bold 18px/40px "Microsoft Yahei";
    }/*主菜单*/
    .main_menu_con{height:40px;border-bottom: 2px solid #39a93e;
    }/*菜单*/
    .center_con02{width:1200px;height: 40px;/*background-color: gold;*/margin:0px auto;/*font-size:12px;*/
    }.center_con02 ul{/*帮助去掉首页左边的线*/float: left;  overflow: hidden;
    }/*商品分类*/
    .center_con02 h2{float:left;width:200px;height: 40px;background-color: #39a93e;text-align: center;font:normal 14px/40px "Microsoft Yahei";color:#fff;
    }/*首页 手机生鲜 抽奖*/
    .center_con02 li{height: 40px;float: left;
    }/*字*/
    .center_con02 li a{display: block;  /*支持宽高*/height:14px;line-height: 14px;padding: 0px 20px;border-left: 1px solid #666;margin-top:13px;color:#666;margin-left: -1px; /*去掉首页左边的线*/
    }/* 字的响应事件*/
    .center_con02 li a:hover{color: #f80;
    }/*主菜单下面的幻灯片和二级菜单和广告*/
    .center_con03{width:1200px;height:270px;/*background-color: gold;*/margin:0px auto;
    }/*菜单ul*/
    .sub_menu_con{width:200px;height:270px;/*background-color: green;*/
    }/*菜单列表*/
    .sub_menu_con li{width:198px;height:44px;border:1px solid #eeeeee;border-top:0px;background:url(../images/icons.png) 175px -385px no-repeat ;
    }.sub_menu_con li a{display: block;height:44px;line-height: 44px;text-indent: 71px;/*font-size: 14px;  可以省略*/color:#333;background:url(../images/icons.png) 35px -90px no-repeat ;
    }.sub_menu_con li .icon02{background-position:35px -136px;}.sub_menu_con li .icon03{background-position:35px -186px;}.sub_menu_con li .icon04{background-position:35px -239px;}.sub_menu_con li .icon05{background-position:35px -288px;}.sub_menu_con li .icon06{background-position:35px -335px;}.sub_menu_con li a:hover{color:#f80;
    }.slide_con{width:760px;height:270px;/*background-color: pink;*/position: relative;   /* 相对定位*/overflow: hidden;  /*裁切超出的部分*/
    }.slide_con .slide_list{position: absolute;  /*绝对定位*/width:4560px;height:270px;left:0;    /*动起来的效果是用程序控制这里的left的值*/top:0;
    }.slide_con .slide_list li{position: absolute;float:left;
    }/*箭头*/
    .prev, .next{position: absolute;  /*绝对定位*/width: 15px;height: 24px;background:url(../images/icons.png) left -450px no-repeat;left:0;top:123px;cursor:pointer;  /*设置鼠标形状 变成手*/
    }.prev{left:11px;
    }.next{left:736px;background-position: left -500px;
    }/*点*/
    .points{/*定位后就没有width=100%的属性了*/position: absolute;width: 100%;/*background-color: green;*/height:11px;left:0;bottom:9px;font-size:0;text-align: center;
    }.points li{/*行内块有间隙  要用父级font-size来改*/display: inline-block;width:11px;height:11px;background-color: #9f9f9f;margin:0 5px;border-radius: 50%;   /*变圆*/cursor:pointer;
    }.points .active{background-color: #cecece;
    }.advs{width:240px;height:270px;background-color: lightgreen;
    }/*有的浏览器中图片会出现3px间隔的bug  解决方法: 将img转成block
    */
    .advs img{display: block;
    }/*食品展示区*/
    /*水果*/
    .common_model{width:1200px;height:337px;margin:20px auto 0;/*background-color: gold;*/
    }.common_title_con{height: 35px;border-bottom: 2px solid #42ad46;/*background-color: green;*/
    }.common_title_con h3{float: left;font:bold 16px/35px "Microsoft Yahei";color:#37ab40;}.common_title_con ul{float:left;height:12px;border-left:1px solid #666;margin:12px 0 0 20px;
    }.common_title_con li{float:left;line-height: 12px;margin-left: 15px;
    }.common_title_con li a{font-size:12px;line-height: 12px;color:#666;
    }.common_title_con li a:hover{color:#f80;
    }.common_title_con .more{float: right;/*line-height: 35px;*/font:normal 12px/35px "Microsoft Yahei";color:#666;
    }.common_title_con .more:hover{color:#f80;
    }/*banner*/
    .goods_banner{width:200px;height:300px;
    }.goods_list{width:1000px;height: 300px;
    }.goods_list li{width:249px;height: 299px;border-right: 1px solid #ededed;border-bottom: 1px solid #ededed;float:left;
    }.goods_list li h4{line-height: 50px;text-align: center;font:normal 14px/50px "Microsoft Yahei";color:#666;
    }.goods_list li a{display: block;width:180px;height: 180px;margin:0 auto 0;
    }.goods_list li .price{font:bold 20px/50px "Microsoft Yahei";color:#c40000;text-align: center;/*height: 50px;*/margin-top:20px;
    }/*版权信息*/
    .footer{border-top:2px solid #4ab14e;margin: 30px 0 40px;text-align: center;
    }.footer ul li{display: inline;
    }.footer_link{margin-top: 38px;
    }.footer_link a{color:#4e4e4e;font-size:12px;
    }.footer_link span{color:#4e4e4e;font-size:12px;padding:0 10px;
    }.footer_link a:hover{color:#f80;
    }.footer p{margin-top:14px;font-size: 12px;
    }
    
  2. reset.css

    /* 将有格式的标签清除格式 *//* 将标签默认的间距设为0 */
    body, p, h1, h2, h3, h4, h5, h6, ul, dl, dt,form, input{margin: 0px;padding: 0px;
    }/* 清除ul的小圆点  ol也有,如果用就加
    */
    ul{list-style: none;
    }/* 去掉默认的下划线 */
    a{text-decoration: none;
    }/* 去掉倾斜 */
    em{font-style: normal;
    }/* 在ie中图片做链接会有一个默认的边框  去掉它
    */
    img{border:0px;
    }/* 去掉默认的大小  -- 让h标签继承body的font-size的设置
    */
    h1, h2, h3, h4, h5, h6{font-size:100%;
    }/* 清除浮动、解决margin-top的塌陷
    */
    .clearfix:before, .clearfix:after{content: "";display: table;
    }.clearfix:after{clear:both;
    }.clearfix{/* ie的bug*/zoom:1;
    }/* 左浮动 */
    .fl{float:left;
    }
    /* 右浮动 */
    .fr{float: right;
    }
    

js

  1. 幻灯片代码slide.js

    $(function(){// 获取每个幻灯片的livar $li = $('.slide_list li');// 幻灯片的个数var $len = $li.length;// alert($len)// 小圆点列表var $points_con = $('.points');// 上一个幻灯片的索引值  -- 要离开var $prevli = 0;// 这个幻灯片的索引值  -- 要显示var $nowli = 0;// 向前的按钮var $prev = $('.prev');// 向后的按钮var $next = $('.next');// 定时器var timer = null;// 幻灯片整体 + 箭头var $slide = $(".slide_con");// 防止用户暴力操作var ismove = false;// 将小圆点放进去for (var i=0;i<$len;i++){var $newli = $('<li>');if (i==0){$newli.addClass('active');}$newli.appendTo($points_con);}// 除了第一个其他的都移动到右边$li.not(':first').css({"left":760});// 获取每一个小圆点var $points = $('.points li');$points.click(function(){// 幻灯片的值等于点那个点的值$nowli = $(this).index();if ($nowli==$prevli){// 解决点同一个小圆点的问题return;}// 小圆点改变$(this).addClass("active").siblings().removeClass("active");// 做动画的函数move();});// 点击向前$prev.click(function(){// 阻止暴力操作if (ismove){return;}ismove = true;$nowli -- ;move();// 改变小圆点$points.eq($nowli).addClass("active").siblings().removeClass("active");});// 点击向后$next.click(function(){// alert(ismove)// 阻止暴力操作if (ismove){return;}ismove = true;autoplay();});// 幻灯片自动播放timer = setInterval(function(){autoplay();},2000);// 当鼠标放上去的时候停下来$slide.mouseenter(function(){clearInterval(timer);});// 鼠标移开$slide.mouseleave(function(){timer = setInterval(autoplay,2000);});function autoplay(){$nowli++;move();// 改变小圆点$points.eq($nowli).addClass("active").siblings().removeClass("active");};function move(){// console.log($nowli);// 第一章幻灯片往前的时候if ($nowli<0){// 当要过来的那个的索引值小于0的时候,要过来的那个索引值改为最大的索引值$nowli = $len-1;$prevli = 0;// 将要过来的放到左边去然后再从左边变成0$li.eq($nowli).css({"left":-760});$li.eq($nowli).animate({"left":0});// 要走的那个往后走$li.eq($prevli).animate({"left":760},function(){ismove = false;});$prevli=$nowli;return;}// 最后一张幻灯片往后的时候if ($nowli>$len-1){$nowli = 0;$prevli = $len-1;// 将要过来的放右边去然后再从右边变成0$li.eq($nowli).css({"left":760});$li.eq($nowli).animate({"left":0});// 要走的那个往前走$li.eq($prevli).animate({"left":-760},function(){ismove = false;});$prevli=$nowli;return;}if ($nowli>$prevli){// 从小到大点// 先把这个li 放到右边$li.eq($nowli).css({"left":760});// 将要走的那张移动到左边$li.eq($prevli).animate({"left":-760});// alert($prevli);// 替换走的那张li$prevli=$nowli;}else{// 点的点小于的时候  从左边过来 先要放到左边去$li.eq($nowli).css({"left":-760});$li.eq($prevli).animate({"left":760});}// 显示的li从 760位置一定到 0 $li.eq($nowli).animate({"left":0},function(){ismove = false;});$prevli=$nowli;}
    });
    

html

  1. index.html

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head><meta http-equiv="Content-Type" content="text/html;charset=UTF-8"><title>天天生鲜-首页</title><!-- 先引入重置的 再引入main --><link rel="stylesheet" href="css/reset.css" /><link rel="stylesheet" type="text/css" href="css/main.css"><script type="text/javascript" src="js/jquery-1.12.4.min.js"></script><script type="text/javascript" src="js/slide.js"></script><script type="text/javascript">$(function(){$.ajax({url:"js/date.json",type:"get",dataType:"json"}).done(function(dat){// 获取成功// alert(dat.name);$('.login_btns').hide();  //  登录藏起来$('.user_info em').html(dat.name);$('.user_info').show();  // 登录信息显示}).fail(function(){// 获取失败alert("服务器超时");});});</script>
    </head>
    <body><!-- 页面顶部 --><div class="header_con"><div class="header"><!-- 左边标题 --><div class="welcome fl">欢迎你来到天天生鲜!</div><!-- 登录状态 --><div class="user_con fr"><!--  ul 没有这个为登录之前的style="display: none"后面用程序来控制--><ul class="login_btns fl"><li><a href="#">登录</a></li><li><span>|</span></li><li><a href="#">注册</a></li></ul><!-- div 没有这个为登录之前的style="display: block"--><div class="user_info fl ">欢迎您:<em>Sugar</em></div><ul class="user_btns fl"><li><span>|</span></li><li><a href="#">我的购物车</a></li><li><span>|</span></li><li><a href="#">我的订单</a></li></ul></div></div></div><!-- logo 搜索框 购物车 --><div class="center_con"><!-- logo --><a href="index.html" class="logo fl"><img src="data:images/logo.png" alt="天天生鲜网站logo"></a><!-- 输入框 --><div class="search_con fl"><form><input type="text" name="" class="input_txt fl" placeholder="搜索"><input type="submit" name="" class="input_sub fl" value="搜索"></form></div><!-- 购物车 --><div class="chart_con fr"><a href="#" class="chart_link fl">我的购物车</a><div class="chart_num fl">5</div></div></div><!-- 主菜单 --><div class="main_menu_con"><div class="center_con02"><h2>全部商品分类</h2><ul><li><a href="#">首页</a></li><li><a href="#">手机生鲜</a></li><li><a href="#">抽奖</a></li></ul></div></div><!-- 主菜单下面的幻灯片和二级菜单和广告 --><div class="center_con03"><!-- 二级菜单 --><ul class="sub_menu_con fl"><li><a href="#">新鲜水果</a></li><li><a href="#" class="icon02">海鲜水产</a></li><li><a href="#" class="icon03">猪牛羊肉</a></li><li><a href="#" class="icon04">禽类蛋品</a></li><li><a href="#" class="icon05">新鲜蔬菜</a></li><li><a href="#" class="icon06">速冻食品</a></li></ul><!-- 幻灯片 用定位做动起来的效果是用程序控制定位中left的值--><div class="slide_con fl"><!-- 图片 --><ul class="slide_list"><li><a href="#"><img src="data:images/slide.jpg" alt="幻灯片" /></a></li><li><a href="#"><img src="data:images/slide02.jpg" alt="幻灯片" /></a></li><li><a href="#"><img src="data:images/slide03.jpg" alt="幻灯片" /></a></li><li><a href="#"><img src="data:images/slide04.jpg" alt="幻灯片" /></a></li></ul><!-- 图片箭头 --><div class="prev"></div><div class="next"></div><!-- 点 宽度等于父级,然后整体居中--><ul class="points"><!--   <li class="active"></li><li></li><li></li><li></li> --></ul></div><!-- 广告 --><!-- 有的浏览器中图片会出现3px间隔的bug  解决方法: 将img转成block--><div class="advs fl"><a href="#"><img src="data:images/adv01.jpg" alt="广告图片"></a><a href="#"><img src="data:images/adv02.jpg" alt="广告图片"></a></div></div><!-- 食品展示区 --><!-- 水果 --><div class="common_model"><!-- 食品标题 --><div class="common_title_con"><h3>新鲜水果</h3><ul><li><a href="#">鲜芒</a></li><li><a href="#">加州提子</a></li><li><a href="#">亚马逊牛油果</a></li></ul><a href="#"  class="more">查看更多&gt;</a></div><!-- 食品图片 --><div class="goods_banner fl"><a href="#"><img src="data:images/banner01.jpg" alt="banner"></a></div><!-- 商品列表 --><ul class="goods_list fl"><li><h4>草莓</h4><a href="#"><img src="data:images/goods/goods003.jpg" alt="草莓"></a><div class="price">¥ 38.00</div></li><li><h4>葡萄</h4><a href="#"><img src="data:images/goods/goods002.jpg" alt="葡萄"></a><div class="price">¥ 5.50</div></li><li><h4>柠檬</h4><a href="#"><img src="data:images/goods/goods001.jpg" alt="柠檬"></a><div class="price">¥ 3.90</div></li><li><h4>奇异果</h4><a href="#"><img src="data:images/goods/goods012.jpg" alt="奇异果"></a><div class="price">¥ 28.5</div></li></ul></div><!-- 食品展示区 --><!-- 海鲜 --><div class="common_model"><!-- 食品标题 --><div class="common_title_con"><h3>海鲜水产</h3><ul><li><a href="#">河虾</a></li><li><a href="#">扇贝</a></li></ul><a href="#"  class="more">查看更多&gt;</a></div><!-- 食品图片 --><div class="goods_banner fl"><a href="#"><img src="data:images/banner02.jpg" alt="banner"></a></div><!-- 商品列表 --><ul class="goods_list fl"><li><h4>青岛生海捕大青虾</h4><a href="#"><img src="data:images/goods/goods018.jpg" alt="青岛生海捕大青虾"></a><div class="price">¥ 48.00</div></li><li><h4>扇贝</h4><a href="#"><img src="data:images/goods/goods019.jpg" alt="扇贝"></a><div class="price">¥ 46.00</div></li><li><h4>冷冻秋刀鱼</h4><a href="#"><img src="data:images/goods/goods020.jpg" alt="冷冻秋刀鱼"></a><div class="price">¥ 19.00</div></li><li><h4>基围虾</h4><a href="#"><img src="data:images/goods/goods021.jpg" alt="基围虾"></a><div class="price">¥ 25.00</div></li></ul></div><!-- 版权信息 --><div class="footer"><ul class="footer_link"><li><a href="#">关于我们</a></li><li><span>|</span></li><li><a href="#">联系我们</a></li><li><span>|</span></li><li><a href="#">招聘人才</a></li><li><span>|</span></li><li><a href="#">友情链接</a></li></ul><p>CopyRight@ 2020 石家庄天天生鲜信息技术优先公司 All Rights Reserverd</p><p>电话: 0311-*****666 冀ICP备********6号</p></div></body>
    </html>
    

json数据

  1. data.json

    {"name":"sugar","age":16
    }
    

js 服务器

  1. server.js

    // 引入相应模块
    var http = require('http'),url = require('url'),path = require('path'),fs = require('fs');var port = process.argv[2] || 8888;var types = {'mp3': 'audio/mpeg','html': 'text/html','css': 'text/css','js': 'application/javascript'
    },
    site = 'http://localhost:' + port;http.createServer(function (request, response) {var uri = url.parse(request.url).pathname,filename = path.join(__dirname, decodeURI(uri));fs.exists(filename, function (exists) {if (!exists) {response.writeHead(404, {'Content-Type': 'text/plain', 'X-my-param':'zcyue'});response.write('404 Not Found\n');response.end();return;}if(!fs.lstatSync(filename).isDirectory()) {var type = filename.split('.');type = type[type.length - 1];response.writeHead(200, { 'Content-Type': types[type] + '; charset=utf-8' });fs.createReadStream(filename).pipe(response);} else {response.writeHead(301, {'Location': site + '/index.html' });response.end();}});
    }).listen(parseInt(port, 10));console.log('Static file server running at\n => ' + site + '/\nCTRL + C to shutdown');

注意事项

  1. js和css的引入顺序是有区别的
  2. 要在服务器启动后运行
  3. node server.js 启动服务器

PC端天天生鲜页面实现相关推荐

  1. react适配PC端和H5页面

    react适配PC端和H5页面 第一种方法: 监听页面尺寸,看页面是否大于适配的宽度,从而选择显示的是移动端还是pc端 import Mobile from './components/mobile. ...

  2. 微信PC端打开网站页面空白

    重点 : 微信pc端的浏览器是IE内核,所以你懂的(PS:IE问题贼多) 解决 : 直接把链接丢到IE上,F12查看控制台,出现什么错误解决什么错误 , so

  3. 微信pc端浏览器打开页面空白的问题

    今天写了一个web项目,用chrome浏览器,手机端微信你打开都没问题,但是在pc端微信打开后是空白的,于是我重新做了一个空白的vue项目,用pc端微信浏览器是可以打开的. 慢慢调试发现是语法的问题 ...

  4. PC端“王者荣耀”页面,【姐妹情缘 今生再续~~~~】

    代码千遍, 其义自见 (纯手撸)~~来一波效果图!!!都是HTML CSS 有一些css3新样式, 非常基础喔. 资源地址:https://github.com/feishanglantian/HEG ...

  5. 【vue+ant-design-vue+a-list】微信扫码登录pc端,后台页面增加微信绑定和微信解绑功能

    兜兜转转,修修改改,又是缝缝补补了几天,终于完成此功能 大致思路:点击绑定微信,出现微信扫码页面,扫码后跳出弹窗,发送验证码验证后可绑定 点击解绑,confirm弹窗确认是否解绑,点击解绑,发送验证码 ...

  6. 使用html编写一个(pc端)静态页面

    html代码 编写的是喜马拉雅的页面 <!DOCTYPE html> <html lang="en"><head><meta charse ...

  7. PC端 UC浏览器页面显示该站点安全证书的吊销不可用

    错误提示 解决办法 关闭的操作步骤: 1.打开IE浏览器 2.在IE浏览器中单击右上角的[设置]图标,选择[Internet选项]进入到选项卡中. 3.在选项卡中找到[安全]选项,关闭如下三个选项,点 ...

  8. html自动跳转手机端,用JavaScript实现网站自动跳转电脑PC端与手机端不同页面

    前天,有一个网友希望在其微擎系统跳转的时候实现鉴别用户不同的客户端,比如电脑PC端和手机端,实现不同的页面跳转.对于之前老蒋有给其设置过PC端网站然后检测手机访问的时候跳转到WAP网站的案例,对于这个 ...

  9. 限制页面被pc端访问

    在需要被pc端访问的页面的脚本里加上如下代码即可: <script>var system = {}; var p = navigator.platform; var u = navigat ...

  10. 手机端访问PC端网站判断识别跳转至手机端页面代码集锦

    一个网站,当访客在手机端上访问的时候,最终落地的应该是手机端的页面.如果网站采用的是响应式框架做了自适应,那么体验是OK的:但是如果网站不是用响应式,而是PC和手机端分离开来,那么访客使用移动设备访问 ...

最新文章

  1. NVIDIA安倍架构
  2. mongodb数据库显示obj_MongoDB基础(三)—基本操作及管理 | leon的博客
  3. dnf超时空漩涡副本路线流程图_DNF超时空漩涡真的不难,掌握这些技巧和打法,自己开团当团长!...
  4. 「后端小伙伴来学前端了」关于Vue中的自定义事件,组件绑定自定义事件实现通信
  5. formal method satisfiable check
  6. php 正则 菜鸟,PHP正则表达式基础入门
  7. 按钮 小程序 弹出菜单_公众号怎么关联小程序
  8. RabbitMQ之mandatory和immediate
  9. 计算机基础和操作系统基础知识测试,计算机基础知识和操作系统.doc
  10. Java基础之扩展GUI——高亮元素、上下文菜单、移动旋转元素、自定义颜色(Sketcher 10)...
  11. 【Kafka】kafka replication factor : 3 larger than avaiable brokers:2
  12. 简单易懂实例说明如何设计子网掩码
  13. 大二英语单词(粗略)
  14. springboot自行车在线租赁管理系统毕业设计源码101157
  15. 微信公号开发之自定义菜单攻略
  16. 郭金东金浦集团荣登“2019中国民营企业500强”和“2019中国民营企业制造业500强”榜单
  17. 借助ChatGPT自动生成PPT
  18. python 输出第一行1个* 第二行3个* 第三行5个*
  19. C51单片机的电子时钟(数码管显示)
  20. ESP UART 介绍

热门文章

  1. 平面、柱面、球面投影
  2. 最常见绩效考核方法有哪些?5种有效方法介绍
  3. ESP32超详细学习记录:获取B站粉丝数
  4. QQ导出的txt聊天记录导入数据库方法
  5. 安装cad提示command_win7系统安装CAD软件失败总是提示“错误1327”怎么解决
  6. VS2019写C++的警告C6262(请考虑将某些数据移到堆中)
  7. Arduino使用433MHz RF射频发射器和接收器的方法
  8. CMT2300A 433MHz SUB-1G无线收发芯片
  9. windows10虚拟桌面快捷键
  10. 华为手机USB调试搜不到设备