利用github page搭建个人网页的过程：先在github里新建一个repository
对repository的settings进行设置：
将git repository clone到本地任意盘，然后打开webstorm创建一个本地对应project，以后只要将本地project目录下的内容copy到git
repository目录就行，
后续通过git bash 进行代码commit到git上（貌似webstorm也可自动commit）
进行git同步，在repository目录直接git bash：
输入网址，查看自己个人网站效果：
水平垂直居中方法一：通过left：50%；top：50%；margin-left和margin-top为center_1div宽高一半的负值
不定高盒子水平垂直居中这样可实现否？（如水平垂直居中方法一）
我才是正宗的不定高盒子水平垂直居中！
我实现了不定宽高的盒子居中！！！77777777778888888888888
水平垂直居中方法二：通过flex布局
语法：
window.open([URL], [窗口名称], [参数字符串])
参数说明：
URL：可选参数，在窗口中要显示网页的网址或路径。如果省略这个参数，或者它的值是空字符串，
那么窗口就不显示任何文档。
窗口名称：可选参数，被打开窗口的名称。
1.该名称由字母、数字和下划线字符组成。
2."_top"、"_blank"、"_self"具有特殊意义的名称。
_blank：在新窗口显示目标网页
_self：在当前窗口显示目标网页
_top：框架网页中在上部窗口中显示目标网页
3.相同 name 的窗口只能创建一个，要想创建多个窗口则 name 不能相同。
4.name 不能包含有空格。
参数字符串：可选参数，设置窗口参数，各参数用逗号隔开。
点击一下，查看js中操作符之间的优先级
举个例子：
利用js的函数为按钮添加事件，改变div（显示或者隐藏等）体会一下清除浮动与不清除的效果！
使用了浮动的div好像在body里面撑不开内容，就像不显示一样的原因
div如果是没有内容的默认是不被撑开的，再有如果div里面的元素全部浮动了，而你有没有清除浮动，那么div会出现高度“塌陷”，也是没有高度的。 再有如果你div里面仅有一个元素，并且定义了absolute或者fixed，那么这个div也是没有高度的。不知道你是否是以上情况中的一个。如果有最简单的 方法就是将div设置一个理想的高度
浮动产生的原因，负作用以及清除浮动的三种方法（介绍得很好，很仔细！）
什么时候需要清除浮动，清除浮动有哪些方法（简书上的回答），也写的非常精湛，易理解！
与此同时，这就牵扯到关于文档流，以及如何脱离文档流的方法（之一就是设置浮动，还有position:absolute;和 position:fixed(相对于浏览器窗口定位）的方法
里面揭示了一个关于不清除浮动，为什么后面元素的内容如p标签里的内容出现位置如此奇怪的原因：
注意！！！：使用float脱离文档流时，其他盒子会无视这个元素，但其他盒子内的文本依然会为这个元素让出位置， 环绕在该元素的周围。
这也是利用浮动特性实现文字环绕效果的深刻体会呀！
父元素设置了position：absolute；或position：fixed之后，子div设置float失效。
js变量命名规则：
1.必须以字母、下划线或美元符$开头，后面可以跟字母、下划线、美元符号和数字。如下：
正确：
mynum
_mychar
$numa1
错误:
6num //开头不能用数字
%sum //开头不能用除(_ $)外特殊符号,如(% + /等)
sum+num //开头中间不能使用除(_ $)外特殊符号，如(% + /等)
2.变量名区分大小写，如:A与a是两个不同变量。
3.不允许使用JavaScript关键字和保留字做变量名。
声明变量语法：var 变量名;
var关键字的作用是声明变量，并为变量准备位置（即内存）
var也可以一次声明多个变量，变量之间用“，”逗号隔开
var num1,num2;
注意：变量也可以不声明，直接使用，但为了规范，需要先声明，再使用。
1.number
2.string
3.boolean
4.undefined
5.null
6.object
如何判断变量类型example：
注意
1. 查找HTML元素使用querySelector()方法；
2. 判断相等时尽量使用“===”别用‘’==‘’，‘’===‘’是属性相等类型相等；
3. null和undefined都是false，number类型中0为false其他值为1；
4. 尽量别使用‘i++’，使用‘i+=i’和‘i=i+1’，在Python不能使用i++这种形式。
JS中null和undefined的区别：
原文链接：
https://www.cnblogs.com/dyh-air/articles/7943295.html
判断变量不为空
一般不用
if(obj==""){}
而用
if(obj){}
原文链接一：
https://blog.csdn.net/qq_42650983/article/details/80975011
原文链接二：
https://www.cnblogs.com/zhengyeye/p/6485124.html
Tab切换实现过程中体会到的getElementsByClassName的神奇之处
js中getElementsByClassName获取到的是一个对象（object），虽然不是数组类型，但是是一种array-like（类数组）对象，
是HTMLCollection,在javascript有array之前就已经存在的东西。
关于getElementsByClassName获取到的对象到底是什么类型？
块级元素设置text-indent才会有效的，span标签设置text-indent无效，a超链接标签设置text-indent无效，因为span和a标签不像
div标签和p标签那样默认
是块元素（默认独占一行才具有空间性）。
轮播图所用技能点：【1】DOM操作【2】定时器【3】事件运用【4】JS动画【5】函数递归【6】无限滚动法
定时器体现在轮播图会自动轮播；无限滚动法的应用使得到了轮播图最后一张图片时，继续轮播，会回到第一张图片。
对于轮播，可以自己吃透js控制，自己动手写复杂的代码实现，但是往往在实际生产活动中，我们都喜欢用一些省事的插件或者框架去实现，
所以轮播图有非常非常多的实现方法，我们尽量掌握最原始的原理，然后学会熟练使用几个轮播图插件。
margin：auto探索出的关于水平垂直居中的另一个小方法！
777777777777777777777777777777777777777777777777777777777777
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
我aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaa aaaa aaaaaa aaaaaaaa aaaa aaaaaaa aaaaa aaaaaa aaaaaaaaaaaaaaaaa
是不是很奇怪，为什么会出现内容溢出？
详解原文链接:
https://zhidao.baidu.com/question/647626760350972565.html
margin塌陷现象的解决：
原文链接：
https://www.cnblogs.com/hugejinfan/p/5901320.html
也可以这样定义数组：在创建数组的同时，为数组指定长度，长度可任意指定。
var myarr=new Array(8);
注意：
1.创建的新数组是空数组，没有值，如输出，则显示undefined。
2.虽然创建数组时，指定了长度，但实际上数组都是变长的，也就是说即使指定了长度为8，仍然可以将元素存储在规定长度以外。
定义数组，给数组赋值，我们可以“一气呵成”将这两步合为一步
第一种方法：
var myarr=new Array(66,80,90,77,59);
第二种方法：
var myarr=[66,80,90,77,59];
获得数组的长度和获得字符串长度是一致的：
二维数组相关
var myarr=new Array() //先声明一维
for(var i=0;i<2;i++){ //一维长度为2
myarr[i]=new Array(); //再声明二维
for(var j=0;j<3;j++){ //二维长度为3
myarr[i][j]=i+j; //赋值，每个数组元素的值为i+j
}
}
2.二维数组的定义方法二var myarr=[[0,1,2],[1,2,3]];
当有很多种选项的时候，switch比if else 使用更方便
语法：
switch(表达式)
{
case值1:
执行代码块 1
break;
case值2:
执行代码块 2
break;
...
case值n:
执行代码块 n
break;
default:
与 case值1 、 case值2...case值n 不同时执行的代码
}
语法说明：
Switch必须赋初始值，值与每个case值匹配。满足执行该 case 后的所有语句，并用break语句来阻止运行下一个case。如所有case值都不匹配，
执行default后的语句。
下面是switch语句的执行效果：
什么是事件
JavaScript 创建动态页面。事件是可以被 JavaScript 侦测到的行为。 网页中的每个元素都可以产生某些可以触发 JavaScript 函数或程序的事件。
比如说，当用户单击按钮或者提交表单数据时，就发生一个鼠标单击（onclick）事件，需要浏览器做出处理，返回给用户一个结果。
主要事件表：
| HTML5新语义元素表 | 这是表头，大多数浏览器会显示为粗体居中文本。 |
|---|---|
| header | 定义文档或节的页眉 |
| nav | 定义导航链接的容器 |
| section | 定义文档中的节 |
| aside | 定义内容之外的内容（比如侧栏） |
| footer | 定义文档或节的页脚 |
| article | 定义独立的自包含文章 |
| details | 定义额外的细节 |
| summary | 定义details元素的标题 |
w3c上关于h5新的8个语义元素好像更为准确，有意思！
HTML5 定义了八个新的语义 HTML 元素。所有都是块级元素。
您可以把 CSS display 属性设置为 block，以确保老式浏览器中正确的行为：
实例
header, section, footer, aside, nav, main, article, figure {
display: block;
}
既然学习了table布局，就深入了解些，边框怎样控制，border="1"什么意思？
border="1"的意思是边框宽度为1px；
单元格边距（cellpadding）:单元格内容与边框之间的空白；（h5已经不再支持）
单元格间距（cellspacing）:单元格之间的距离；（h5已经不再支持）
关于cellpadding和cellspacing在h5中不再支持的详细说明--原文链接：
https://www.cnblogs.com/liuyonglong/p/3707872.html
td：table data（单元格数据）；
可以分别给不同的表格行设置background，以颜色来凸显区别；
border-collapse:collapse(设置后将表格中相邻边框合并为一条，默认是separate)
关于<!doctype html>：
原文链接一：
http://www.w3school.com.cn/tags/tag_doctype.asp
原文链接二：
https://blog.csdn.net/weixin_38469425/article/details/79732718
| 版本 | 年份 |
| HTML | 1991 |
| HTML+ | 1993 |
| HTML2.0 | 1995 |
| HTML3.2 | 1997 |
| HTML4.01 | 1999 |
| XHTML1.0 | 2000 |
| HTML5 | 2012 |
| XHTML5 | 2013 |
HTML字符实体介绍，比如<,>,©等怎么表示
详述见链接：
http://www.w3school.com.cn/html/html_entities.asp
HTML5 - 新特性
HTML5中一些最有趣的新特性：
| 标签 | 描述 |
| <canvas> | 定义使用JavaScript的图像绘制 |
| <svg> | 定义使用SVG的图像绘制 |
<canvas id="myCanvas" width="200" height="100"></canvas>
<script type="text/javascript">
var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");
cxt.fillStyle="#FF0000";
cxt.fillRect(0,0,150,75);
</script>
canvas默认宽高300*150
字符串（string）对象
定义好字符串以后，我们就可以访问它的属性和方法。
1.访问字符串对象的属性length：
2.访问字符串对象的方法：
Math对象
使用math的属性和方法：
var mypi=Math.PI;
var myabs=Math.abs(-15);
document.write(mypi);
document.write(myabs);
数值数组升序降序sort实现
方法/步骤
1.首先我们需要下载破解补丁，直接百度搜索关键词——IntelliJ IDEA 注册码。进入红框处网站后，下载红框标注的补丁文件。
2.然后将补丁复制到webstorm安装目录的bin文件夹下面。(右键webstorm桌面快捷方式，选择打开文件所在的位置)
3.接下来需要修改文件，使用记事本打开bin文件夹下面的WebStorm.exe.vmoptions 和WebStorm64.exe.vmoptions这两个文件。
4.然后这里非常关键，在打开的文件最后面加上如下代码：
-javaagent:+路径名称+jar包名称，例如图片上我的路径，修改之后保存文件。
注意这里的路径需要替换成你自己的安装路径，并且是左斜杠“/”，jar包的名称也必须是你刚刚下载的jar包名称。
5.保存完毕之后，回到IntelliJ IDEA 注册码的网页，点击中间的获得注册码，然后复制弹出的注册码。
6.重新启动WebStorm，依次点击【help】——【register】——【activation code】，
然后粘贴输入激活码，确认就可以了。
系统右下角会弹出激活提示。
原文链接地址：
https://jingyan.baidu.com/article/77b8dc7faa0ece6174eab6d8.html
因为canvas元素有个默认宽高的问题，我们是不能在style里面去定义canvas宽高的，这样就会出现一个将画布进行拉伸
操作的现象，很影响效果。
<canvas height="200" width="200"><canvas>这种定义宽高的方式是完全ok的，我们要明确一个问题，这里的width、height
和样式style里面的width、height不是同一回事，这里的width、height就是指canvas画布右下角的X、Y坐标。
（有没有发现canvas的宽高定义方法和图片一样，不带单位，但单位就是像素px）
原文链接：
https://www.cnblogs.com/xiaqilin/p/6841661.html
那如何画一个圆或者或圆弧呢？
详细介绍链接：
https://www.cnblogs.com/joyco773/p/5435393.html
下面是我自己在canvas下体会一下如何画圆，和画圆弧。
浏览器对象
介绍浏览器对象中，history,navigator,screen,location等。
window对象是BOM（Browser Object Model,浏览器对象模型）的核心，window指当前的浏览器窗口。
window对象方法：
计时器setInterval
在执行时，从载入页面后每隔指定的时间执行代码
语法：
setInterval(代码，交互时间)；
参数说明：
1. 代码：要调用的函数或要执行的代码串。
2. 交互时间：周期性执行或调用表达式之间的时间间隔，以毫秒计（1s=1000ms）。
返回值:
一个可以传递给 clearInterval() 从而取消对"代码"的周期性执行的值。
调用函数格式(假设有一个clock()函数):
setInterval("clock()",1000)
或
setInterval(clock,1000)
利用setInterval()函数显示动态时间：
下面这种动态显示时间的方式是更优的，比较美观格式化！
原文链接：
https://bbs.csdn.net/topics/390256532
计时器setTimeout()
setTimeout()计时器，在载入后延迟指定时间后,去执行一次表达式,仅执行一次。
语法:
setTimeout(代码,延迟时间);
参数说明：
1. 要调用的函数或要执行的代码串。
2. 延时时间：在执行代码前需等待的时间，以毫秒为单位（1s=1000ms)。
使用setTimeout()实现计数统计效果，并在文本框中显示数值。
由此联想到倒计时效果，并在文本框中显示数值。
History对象
history对象记录了用户曾经浏览过的页面(URL)，并可以实现浏览器前进与后退相似导航的功能。
注意:从窗口被打开的那一刻开始记录，每个浏览器窗口、每个标签页乃至每个框架，都有自己的history对象与特定的window对象关联。
语法：
window.history.属性|方法
注意：window可以省略。
History 对象属性
History 对象方法
location对象
location用于获取或设置窗体的URL，并且可以用于解析URL。
语法:
location.属性|方法
location对象属性图示:
location对象属性:
location对象方法:
如何使用css画出三角形
一定要深刻理解border的宽并不是画出来的三角形的边长，下面这张图会让你深刻理解一下：
编程练习：
制作一个跳转提示页面：
要求：
1. 如果打开该页面后，如果不做任何操作则5秒后自动跳转到一个新的地址，如慕课网主页。
2. 如果点击“返回”按钮则返回前一个页面。
效果:
充值完成，5秒后跳回主页！
string与json互相转化
1.string转json
这个JSON.parse()与eval()都可以实现,但是它们是有区别的,
JSON.parse对json字符串要求比eval()更为严格，key名称(例如name)全部必须有双引号。
而eval必须用括号将json字符串括起来才能成功转换,key名称(例如name)有无双引号都可以成功转化。
2.json转string
json的key名称(例如name)有无双引号都可以成功用JSON.stringify()实现转化,但是注意我们最好还是将双引号写上
(或者要求后端在返回数据的时候为key名称加上双引号)。
原文链接：
https://www.cnblogs.com/jewave/p/5830637.html
像素与分辨率的区别：
组成图像的最小单位是像素，而屏幕分辨率是由DPI（Dots Per Inch 每英寸点数）决定的，像素不等同于分辨率。
windows配置github ssh key原文链接：
https://blog.csdn.net/MissXy_/article/details/79901949
绝对路径与相对路径，以及涉及到的html中引用文件、css中引用文件和js中引用文件问题：
js中引入图片方法：
https://blog.csdn.net/qq_29273683/article/details/78110657
html不设置font-size时默认字体大小是16px,字体大小最小为12px（浏览器可解析，其实字体最小可以到9px，
12px不过是所有浏览器都支持的，具有普遍性），像素必须是整数，一般要求是偶数的整数，其实奇数也没影响
盛世情微，再无终老777
盛世情微，再无终老777
盛世情微，再无终老777
盛世情微，再无终老777
如果想比9px字体都小，能否实现呢？
点击我，跳转到实现链接...(下面这行文字为实现出来的效果)
盛世情微，再无终老777
盛世情微，再无终老777（最终发现实在无法实现，9px应该已经是最小字体啦！！！）
盛世情微，再无终老777
1.刚开始为了避免激活等麻烦事情，我选择了IDEA community版本，可是在里面配置tomcat的时候遇到一个问题一直没法解决，与下面链接
https://blog.csdn.net/qq_33499534/article/details/85632282
里面描述的情况一模一样
2.于是我弃用了IDEA community版，改用IDEA Ultimate（终极版），具有更加强大的功能，并且也能很方便地配置tomcat。
但是使用IDEA Ultimate版就涉及到一个激活的问题，当然是希望永久激活呀！发现激活过程竟然和WebStorm有异曲同工之妙，
打开百度，搜索IntelliJ IDEA注册码，进入后，如下图：
下载后之后参考IDEA激活链接原文地址：
https://blog.csdn.net/yl1712725180/article/details/80309862
然而把里面的破解码输入到Activation code框里面是不行的，会出现key is invalid的情况，这时候就需要试试好心人下面的评论了，
我的解决办法License is valid till Nov 23, 2017的问题, 在avtivation code页面, 输入jar地址, 我的是 -javaagent:C:\Downloads\Tool\idea\
ideaIU-2018.3.3\bin\JetbrainsIdesCrack-4.2-release-sha1-3323d5d0b82e716609808090d3dc7cb3198b8c4b.jar 即可。
那么，我只要输入自己的jar地址就好，果然ok，成功永久激活IDEA，哈哈！
3.tomcat下载,我点击了红色框进行下载，结果下载到我的电脑本地目录：E:\Choreme_downloads是一个.exe安装文件，然后我进行了安装
好像安装过程中也无法选择安装目录，就默认安装到了C:\Program Files\Apache Software Foundation\Tomcat 9.0，点击蓝色框就是下载压缩包了，
下载好之后解压就可以，无需安装。在此之后，还需要进行
环境变量配置，配置过程如下：
新建系统变量：CATALINA_HOME
变量值：C:\Program Files\Apache Software Foundation\Tomcat 9.0
系统变量Path中添加：%CATALINA_HOME%\bin
然后在cmd命令窗口下输入startup（如果未设置环境变量，会报错，“startup”不是内部或者可执行命令），成功启动tomcat，当然另一种启动方式是
到tomcat的bin目录下点击startup.bat，两种启动方式无论哪种，一旦启动都不能关闭命令窗口，不然就不能访问tomcat主页了，访问tomcat主页的方式是：
网址里输入localhost:8080
可是在我启动IntelliJ IDEA后，一个麻烦的事情出现了，有时候dos窗口下输入startup会报错，win+x快捷键，选择Windows Powershell以管理员身份打开命令窗口，
输入startup倒是可以启动，可是会闪退，之后仍然无法访问tomcat主页。这是因为我们首次运行IDEA，并没有很好地进行配置。
结果我傻愣愣地先dos窗口下启动好了tomcat，然后IDEA里面编译运行时一直报错：报错信息如下：
Error running "Tomcat 9.0.14":Address localhost:8080 is already in use
折腾了好些时间，具体原因很简单，参考链接：
https://zhidao.baidu.com/question/66486087.html
maven安装与在IDEA里面的配置
我的maven下载目录是：E:\Choreme_downloads，下载好压缩包后进行解压，然后进行下面的操作
参考链接：
https://www.cnblogs.com/eagle6688/p/7838224.html
然而，这些弄好之后，我还是没把symphony-demo跑通，编译时还是出了些问题，继续解决好吧，停留两三天了都，暂时性卡住......
先不说没跑通这个事情，即使能跑通，也是需要数据库支持的，为此，我下载好了my sql 数据库（community版本，应该够用吧），
下载目录：E:\Choreme_downloads， 安装目录：C:\Program Files
在不断跑项目的过程中，又遇到一个新的问题，那就是IDEA里面启动tomcat时输出的server log日志文件中文乱码问题：
解决方法：参考原文链接--
https://blog.csdn.net/nan_cheung/article/details/79337273
新问题：在用tomcat跑maven项目的时候，输出的server log日志文件里一个报错信息如下图：
解决方法：参考原文链接--
https://blog.csdn.net/jiankunking/article/details/51462111
