web
关注
分享
扫一扫
让梦々冬眠
努力无需立竿见影，奋斗仍需无畏坚持。
展开
-
vue+nodejs+element 实现drawio绘图效果
draw项目地址：github个人博客：smilestation.info类似drawio效果，本项目采用前后端分离模式开发前台采用 vue + element后端采用 nodejs数据库采用 MySQL文件夹说明server 后端文件夹client 前端文件夹主要内容说明：实线箭头drawArrow (Object)ctx: context对象fromX: 开始点x坐标值类型numberfromY: 开始点y坐标值类型numbertoX:原创 2020-07-11 12:38:30 · 5220 阅读 · 2 评论 -
【前端】相信你会用到的一篇笔记---CSS篇（2）
1.文档流正常：自上向下，自左向右如果两个相邻元素都在其上设置外边距，并且两个外边距接触，则两个外边距中的较大者保留，较小的一个消失2.布局模式在网页中，元素有三种布局模型：流动模型（Flow） 默认的浮动模型 (Float)层模型（Layer）流动（Flow）模型是默认的网页布局模式。也就是说网页在默认状态下的 HTML 网页元素都是根据流动模型来分布网页内容的。任何元素在默认情况下是不能浮动的，但可以用 CSS 定义为浮动层模型有三种形式：1、相对定位(position: re原创 2020-05-24 10:55:34 · 1873 阅读 · 0 评论 -
【前端】相信你会用到的一篇笔记---CSS篇（1）
1.什么是 CSS ？ CSS有什么用？css 是层叠样式表，用于改变网页的布局。例如字体，颜色，大小，间距等2. CSS语法CSS是一种基于规则的语言，您可以定义规则来指定应应用于网页上特定元素或元素组的样式组h1 { color: red;}css 声明包括：选择器和属性组（属性名:属性值）3. CSS 是如何工作的？浏览器加载HTML将HTML转换为DOM浏览器将获取HTML文档链接的大多数资源，例如嵌入式图像和视频…以及链接的CSS浏览器解析提取的CSS，并根据选择原创 2020-05-23 15:56:07 · 345 阅读 · 0 评论 -
【前端】相信你会用到的一篇笔记---HTML篇
个人博客：smile小站欢迎来访，欢迎互换友链1.什么是 HTML ？HTML 是一种超文本标记语言HTML 是一种标记语言而非编程语言HTML 是网站的骨架，负责整个网站的结构HTML5 ：HTML5是构建Web内容的一种语言描述方式HTML5是Web中核心语言HTML的规范HTML5在从前HTML4.01的基础上进行了一定的改进HTML5 是最新的 HTML 标准。HTML5 是专门为承载丰富的 web 内容而设计的，并且无需额外插件。HTML5 拥有新的语义、图形以及.原创 2020-05-22 20:55:37 · 336 阅读 · 0 评论 -
前端面试有这几篇就够了--HTML篇
1.前端需要注意哪些 SEO合理的 title、description、keywords：搜索对着三项的权重逐个减小，title 值强调重点即可，重要关键词不要超过2次，而且要靠前，不同页面 title 要有所不同；description 把页面内容高度概括，长度适合，不可过分堆砌关键词，不同页面的 description 有所不同；keywords 列出重要关键词即可。语义化的 HTML 代码，符合W3C 规范：语义化代码让搜索引擎理解网页重要的 HTML代码放在最前面：搜索引擎抓取 HTML 顺原创 2020-05-20 17:59:20 · 623 阅读 · 0 评论 -
原来闭包也可以这么简单
闭包是js开发常的技巧，那么什么是闭包呢？闭包就是能够读取其他函数内部变量的函数。例如在javascript中，只有函数内部的子函数才能读取局部变量，所以闭包可以理解成“定义在一个函数内部的函数“。在本质上，闭包是将函数内部和函数外部连接起来的桥梁简而言之：闭包就是一个函数。15稍微具体点：闭包就是能够读取其他函数内部的函数...原创 2020-05-19 17:17:07 · 339 阅读 · 0 评论 -
个人博客升级改造ing
本文介绍由于上个版本个人博客的UI,功能等存在着许多不完善的地方，因此决定对博客进行升级改造计划.致力打造出更优秀的个人博客改造日记开始个人博客改造计划 2020/4/20原博客展示博客以wordpress建站主页内容页博客介绍博客采用node从前台到后台进行搭建开发技术前端三剑客Nodeejsexpressexpress-sessionmysq...原创 2020-04-24 21:26:13 · 350 阅读 · 0 评论 -
js事件流
事件HTML中与javascript交互是通过事件驱动来实现的，例如鼠标点击事件、页面的滚动事件onscroll等等事件流"DOM2事件流"规定的事件流包括三个阶段：事件捕获阶段处于目标阶段事件冒泡阶段事件绑定可采用 addEventListener(事件名,事件处理函数,处理方式)事件名：String事件处理函数：function事件处理方式：boolfalse ...原创 2019-08-13 17:24:01 · 211 阅读 · 0 评论 -
String
介绍javaScript 中字符串可分为字符串对象和基本字符串两种。通过单引号或双引号定义 和 直接调用String方法的字符串都是基本字符串。JavaScript会自动将基本字符串转换为字符串对象，只有将基本字符串转化为字符串对象之后才可以使用字符串对象的方法。转义字符字符输出\0空字符\'单引号\"双引号\\反斜杠\n换行...原创 2019-08-18 15:58:34 · 203 阅读 · 0 评论 -
温故知新----css布局
css布局本文针对多种css布局进行解析在线demo代码：gitHub布局：浮动布局 定位 弹性盒子 表格 网格- 浮动(float)- left 将元素浮动到左侧。- right 将元素浮动到右侧- none(默认) 不浮动- inherit 继承父元素的浮动属性- 定位(position)- static(默认) 静态定位: 将元素放在文档...原创 2019-08-07 15:39:49 · 468 阅读 · 0 评论 -
js游戏-首页优化
小游戏demo持续更新中...（2019/8/30）新增扫雷小游戏布局优化1.采用网格+响应式可根据设备尺寸调整每行元素个数2.用圆角属性来对new,hot,活动显示3.增加信息多行省略交互优化1.增加交互性，可自动生成游戏代码解析：内容超出显示省略号单行：.game-info { overflow: hidden; text-o...原创 2019-08-09 17:59:08 · 2174 阅读 · 0 评论 -
css动画
css动画CSS animations使得可以将从一个CSS样式配置转换到另一个CSS样式配置。动画包括两个部分:描述动画的样式规则和用于指定动画开始、结束以及中间点样式的关键帧。动画配置创建动画序列，需要使用animation属性或其子属性动画的实际表现是由@keyframes规则实现animation属性：animation-name指定由@keyframes描...原创 2019-08-07 19:15:41 · 189 阅读 · 0 评论 -
Array
上一节我们已经说过了string,接下来我们谈一谈js中另一种常见对象Array介绍JavaScript的Array对象是用于构造数组的全局对象，数组是类似于列表的高阶对象那么如何创建一个数组，又怎么使用数组呢？下文中会详细介绍。创建数组在 js 中，我们用[]来表示一个数组元素，我们可以通过let arr = []的方式来创建一个空的数组，当然我们也可以通过let arr = new ...原创 2019-08-19 15:28:30 · 294 阅读 · 2 评论 -
Map 与 Set
Map 与 Set在javaScript 中Map 和 Set可以用容器来理解记忆，类似的Array可以当作队列容器和栈容器MapMap对象以键值对的形式存在，任何值都可以作为一个建或一个值在Map中，键和值呈一一对应的关系注意：键值具有唯一性Map的创建与使用可以用let myMap = new Map()来创建一个Map对象通过myMap.set(key, value)方法来向...原创 2019-08-21 15:32:39 · 251 阅读 · 0 评论 -
call、apply和bind的用法与说明
介绍call、apply、bind的作用是改变函数运行时this的指向，欲了解函数，首先需知thisthisthis到底是什个什么样的东西呢？this即“这个”的意思,在代码中this指向调用函数的主体对象。举个栗子：在一个代码中，例如：var obj = { foo: function(){ console.log(this) }}var bar = obj.fo...原创 2019-08-17 16:42:40 · 687 阅读 · 0 评论 -
js小游戏---扫雷
前言扫雷小游戏已推入giiHub点击此处试玩欢迎各位体验，菜鸡的练手小项目，轻喷。同样可在留言处或在线咨询提出您宝贵的意见，祝您玩得愉快介绍扫雷小游戏通过洗牌算法进行随机布雷，通过用户点击对旁边区域进行搜索判断，达到空白的展开效果目前游戏中有9*9，15*15，20*20三张地图，后期会加入更多。雷数可自己调节或随机生成难点详解洗牌算法：洗牌算法可实现集合的随机排序，且各排序...原创 2019-08-29 19:42:17 · 211 阅读 · 2 评论 -
课程表
前言继前两版课程表之后迎来了新版课程表，此版本采用简约模式，布局一切从简。第一版采用背景图来衬托整体视觉效果第二版采用了渐变来渲染介绍本次课程表采用自定义填充模式，添加，删除课程简单，代码清晰易于理解。状态可根据时间进行自动调整。代码结解构骨架（HTML）<!DOCTYPE html><html lang="en"><head> &...原创 2019-09-05 16:26:53 · 1710 阅读 · 0 评论 -
vue+element+node构建单片机控制系统
前言应课程设计要求目前在做一个单片机控制系统（软件模块），其中主要包括前端部分，后端部分，服务器部署三块。目前正在开发前端界面。开发环境· 系统：win10· 编辑器：Visual Studio Code· 服务器：阿里云轻量级应用服务器框架结构...原创 2019-09-12 13:54:38 · 1008 阅读 · 3 评论 -
js 小游戏
js 小游戏点击demo即可开始代码：gitHub## 知识点- javascriptJavaScript 是轻量级解释型语言- 定义：是一种脚本语言，可以用来创建动态更新的内容，控制多媒体，制作图像动画...- api 通常分为两类- 浏览器 API 内建于 web 浏览器中- 文档对象模型 API（DOM（Document Object Model）API）...原创 2019-08-08 18:18:56 · 1572 阅读 · 0 评论 -
温故知新----css盒模型
盒模型练习效果预览：demo代码：gitHub## 知识点- 盒模型- 属性：- width 和height 设置了内容框的宽/高- padding 设置内边距- border 设置边框- margin 设置外边距- overflow 溢出- auto 如果内容太多，那么超出盒子大小的内容会被隐藏，滚动条显示出来，从而可以让用户滚动看到所有内容。-...原创 2019-08-06 14:57:54 · 282 阅读 · 0 评论 -
简单网页-------课程表
简单网页-----课程表1.效果图2.具体代码如下<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>Class</title> <style type="text/css">原创 2018-09-12 19:31:32 · 7457 阅读 · 2 评论 -
网页模板----01
模板--011.代码展示<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>web</title> <style type="text/css"> body{ ba原创 2018-09-24 16:00:29 · 203 阅读 · 0 评论 -
前端-----文本类标签汇总
文本类标签汇总一、标题块：<title>这里可以用来给 html 文档添加一个标题</title> <h1>这是一个顶级标题</h1> <h2>二级子标题</h2><h3>三级子标题</h3><h4>...</h原创 2019-01-17 12:25:02 · 660 阅读 · 0 评论 -
HUSTOJ（2019）在线判题系统的从零开始搭建过程
目录HUSTOJ（2019）在线判题系统的搭建一：配置LAMP环境二：安装HUSTOJ三：管理数据库：四：配置oj五：oj优化六：将web文件夹内容放入文件夹/var/www/html 中（最重要）七：其他操作(此处无需用到)八.博客参考HUSTOJ（2019）在线判题系统的搭建注意：此为2019年1月版本，最新版本安装以官网为准一：配置LAMP环...原创 2019-01-21 21:17:49 · 9693 阅读 · 7 评论 -
前端-----今日份小练习
任务介绍：标记字母此文主要为练习布局，未用到标签语义化，若需查看语义化标签练习访问此处项目概要：在这个项目里，你的任务是标记一封放在大学内网上的信，这封信是研究人员对一名未来的博士生的回复，关于他们在大学工作的申请。块/结构语义：你应该使用适当的结构来构造整体文档，包括doctype、<html>、<head>和<body>元素。 除下...原创 2019-01-16 19:26:14 · 1043 阅读 · 2 评论 -
随机样例生成器
功能介绍:根据用户所选择的内容可生成相应的随机样例,可生成:①整型数据,字符型数据,字符串类型数据②字符与字符串数据可根据需求调大小写③可生成任意组数的数据④每组可调节固定数量,或随机数量⑤整型数据可调节随机范围效果图: 代码:①html部分<!DOCTYPE html><html lang="en"><...原创 2019-01-28 13:47:35 · 1509 阅读 · 1 评论 -
前端-----小米商城模块练习
任务介绍:小米商城模块化练习效果图①小米官方图②效果图代码①html部分<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="w原创 2019-01-28 19:51:26 · 2196 阅读 · 4 评论 -
随机样例生成器(外观优化)
说明利用浮动布局方法对生成器进行了外观上的优化.其可根据窗口的大小自动调节另外在点击按钮时会有动画效果产生效果图 css部分代码body{ background: linear-gradient(315deg,rgb(127, 213, 247),rgb(158, 234, 240)); margin: 0; text-align: c...原创 2019-01-31 12:15:44 · 774 阅读 · 0 评论 -
blog登陆框
新的博客主题发现没有登陆接口,针对这一问题写了一个登陆窗口可在此页点击小猫查看效果demo博客刚建成还在不断完善中.....:http://smile6666.com/...原创 2019-07-09 17:03:43 · 124 阅读 · 0 评论 -
计算机网络基础
计算机网络基础内容内容持续更新中...传送门1传送门2原创 2019-07-11 12:29:26 · 121 阅读 · 0 评论 -
http | 状态码
传送门(=@__@=)哪里？...............................................................自己写了个主题上传之后竟然把整个网站弄崩了╮(╯﹏╰）╭原创 2019-07-12 15:54:40 · 168 阅读 · 0 评论 -
温故知新----表格
构建行星数据本项目复习表格的使用，项目参考于：MDN点击此处查看效果gitHub任务介绍- 为你的表格添加我们提供的标题。- 在表格的 header 中添加一行，用来包括所有列的标题。- 在表格的 body 部分创建所有内容行，记住要让所有是行标题的单元格语义化。- 确保所有内容都插入了正确的单元格，在原始数据中，每行行星数据都显示在其相关行星的旁边。- ...原创 2019-08-03 17:03:28 · 339 阅读 · 0 评论 -
温故知新----表单
# form表单查看详情点击gitHub## 任务介绍复习表单的使用## 知识点- form 创建表单<br>当您想要创建一个HTML表单时，都必须从这个元素开始，然后把所有内容都放在里面。- 主要属性- action 定义了在提交表单时,应该把所收集的数据送给谁- method 定义了发送数据的HTTP方法(它可以是“get”或“p...原创 2019-08-04 15:38:58 · 294 阅读 · 0 评论 -
温故知新----css基础
# css练习项目参考至MDN点此查看效果哦代码## 任务介绍- 为整体卡片的容器提供一个固定的宽/高，背景颜色，边框，以及边框圆角等等。- 为header提供一个渐变的背景颜色，从更暗到更亮，加上圆角，配合在卡片容器上设置的圆角。- 为footer提供一个渐变的背景颜色，从更亮到更暗，加上圆角，配合在卡片容器上设置的圆角。- 将图像向右浮动，使其粘贴在...原创 2019-08-05 12:31:37 · 521 阅读 · 0 评论 -
css选择器
css选择器gitHub选择器介绍：㈠派生选择器(上下文选择器) 通过依据元素在其位置的上下文关系来定义样式，你可以使标记更加简洁。派生选择器可以批量定义㈡class类名选择器(单类,多类) 类选择器允许以一种独立于文档元素的方式来指定样式。 该选择器可以单独使用，也可以与其他元素结合使用。㈢id选择器(特定元素) 在某些方面，ID 选择器类似于类选...原创 2019-08-05 12:54:34 · 157 阅读 · 0 评论 -
温故知新----标签的语义化
本项目主要练习标签的语义化，项目参考于：MDN Web Docs已上传至gitHub结构语义化：demo任务介绍- 块/结构语义：- 你应该使用适当的结构来构造整体文档，包括doctype、<html> 、 <head>和<body>元素。- 除下面提到的几点之外，这封信应该被标记成有着段落和标题的结构。 这封信有 1 个顶级标题（“回复...原创 2019-08-01 16:33:21 · 485 阅读 · 1 评论 -
JavaScript 中常用的弹窗
JavaScript 中常用的弹窗目录1.警告弹窗2.确认弹窗3.提示弹窗 JavaScript 中常用的弹窗1.警告弹窗 alert();警告框经常用于确保用户可以得到某些信息。当警告框出现后，用户需要点击确定按钮才能继续进行操作。例:<!DOCTYPE html><html><head><meta ch...原创 2018-09-08 18:07:57 · 466 阅读 · 0 评论