- 博客(18)
- 收藏
- 关注
RSS订阅原创 Vue初始（2）—— 前端路由
为了追求更好的用户体验，Vue提供了vue-router插件，可以在不改变url的同时改变界面的某些部分，这样用户就可以拥有更好的体验。SPA前端路由的原理：锚点替换，再加上innerHTML内容的替换hashchange事件当url的片段标识符改变时，便会触发hashchange事件window.addEventListener('hashchange',function(){ ...
2019-04-05 17:12:18
341
原创 vue初识——1
因为一些原因决定把自己学的vue的一些知识都整理一下，系统的复习一下，同时查漏补缺。今天复习的内容 window.onload = function(){ var App = { template: `<div> <input type="text" v-model="message"> {{message | rever(...
2019-04-03 19:57:02
280
原创 发现自己‘欠练’日常
昨天和今天就干了写了三个页面，应该说比较重要的页面就一个，其他的两个就简单的来个table，加一些简单的输入框之类的，但是就是这两个简单的页面也出了一些问题：因为不让使用栅格，突然发现行内和自动适应宽度成了问题，而且无数的div看了真是让我头疼，一会就看不清楚到底哪个是哪个了，一会觉得少了个结束标签，一会又觉得自己多写了。解决方法：行内一般都是input和button时使用，所以在form...
2019-03-28 18:40:06
302
原创 v-for 实现导航栏的路由跳转
导航栏的路由跳转想要实现的效果，点击某个列表时，页面、会自动跳转到那个页面。最开始构建页面时，使用的是7个li，先将页面布局写好。实现的办法是：使用v-for，循环li，点击的时候动态获取各自的跳转路由 <ul role="menubar" class="el-menu--horizontal el-menu" :class="$style.d_el_men...
2019-03-26 11:59:43
1567
原创 vue+element 树形控件初次使用
树形控件初次使用element树形控件可以用很清晰的层级结构展示信息，可以展开，也可以折叠。 <el-tree :data="data5" node-key="id" default-expand-all :expand-on-click-node="false...
2019-03-26 11:32:30
5255
原创 员工详情弹出框
员工详情页面弹出框果然自己学习的和真正在用的时候还是有些不一样的地方，各种的代码不生效，还有就是代码的不规范，依旧最开始自己没有写注释，然后被各种各样的函数名弄得头痛，将自己第一次写的记录一下，记得自己最开始犯的傻。希望实现效果：点击员工详情按钮，弹出一个弹窗，将员工任职时所有的信息输出，包括照片等附件，弹窗包括三个按钮：重新编辑，取消，保存。弹窗在一开始是不能进行编辑的，点击重新编辑之后部分...
2019-03-21 16:30:23
829
原创 冒泡，选择，插入，快速四种排序方法——PHP
冒泡排序：通过对待排序序列从后向前依次比较，把最大/最小的数排到最后function bubble_arr(&$arr){ $c_arr = count($arr); $num=0; for($i=0;$i<$c_arr-1;$i++){ for($j=0;$j<$c_ar...
2018-11-20 18:40:04
187
原创 transition——过渡
过渡三要素：有属性发生变化，告诉系统哪个属性发生变化，告诉系统过渡持续的时间。transition：过渡属性，过渡时长，运动速度，延迟时间过渡的属性：transition-property: width;如果需要给多个属性添加过渡效果，用逗号隔开 ：width，height过渡时长：transition-duration: 1s;过渡的延迟时间：transition-delay： 0s...
2018-11-17 21:52:32
242
原创 等高布局——padding补偿法
在圣杯布局中有使用到padding补偿法这个方法的步骤：是首先把列的padding设为一个足够大的值，再把列的margin设一个与前面的padding的正值相抵消的负值，在父容器中要记得设置超出隐藏 >>> overflow:hidden，这样就可以在元素高度不变时，保持现有高度不变。我的理解：当父容器被里面最高的那个元素撑到一定高度时，其他高度不够的元素就可以使用pad...
2018-11-14 21:53:48
547
原创 flex——弹性布局
弹性布局可以为盒状模型带来很大的灵活性。容器中存在两条轴，水平的主轴和垂直的交叉轴，项目默认以主轴排序。设置flex弹性布局时，记得将容器的布局指定为flex布局。>>> display: flex行内模型也可以设置flex布局，>>> display: inline-flex容器的六个属性：flex-direction决定主轴的方向（默认是水平轴）...
2018-11-14 21:34:19
1236
原创 双飞翼布局、列表布局、圣杯布局、新浪布局
双飞翼布局：中间自适应，两边固定中间的盒子固定没有确定的宽度，根据margin来计算宽度，没有显性设置宽度，来达到自适应的目的为了让left，right，contain放在一行内，使用了浮动布局。float：leftleft固定在整个浏览器的右边，根据margin-left的值来进行调整，移动contain的宽度，为了让left宽度固定，所以显性的设置了宽度right在原本...
2018-11-04 20:43:42
188
原创 CSS精灵图
精灵图CSS精灵图也可以说CSS雪碧图就是将多个小的图片整合在一张图上，这样就可以减少浏览器向服务器请求的次数，可以提高网页的加载速度。使用精灵图时一定要注意显示精灵图的这个容器一定要比背景图片小才可以，否则就会漏出精灵图上的其他背景图片，所以一定要控制好盒子的大小。精灵图在各种浏览器上使用的非常频繁，如一下情况前面的这一部分就是使用精灵图来显示照片，整的精灵图就是以下这个样子为什...
2018-11-04 20:27:12
3185
原创 3D 照片墙
今天又看了直播课，原生js做的照片墙，主要使用的transtion和transfrom，感觉还是很考验的个人对于css的理解，至于js部分还是比较见到的，就使用了一个拖拽的功能。拖拽原理：距离不变，三个事件：onmousedown存储距离，onmousemove根据距离计算div最新位置、onmouseup取消拖拽。这个是一个简单的div的拖拽，HTML部分和css部分都没有什么，一个d...
2018-10-20 22:08:54
1694
原创 波浪导航栏
放了个国庆假把自己都放疯了，赶紧回来学习，发个誓，绝对没有下一次了。波浪式导航栏效果颜色，不要介意！！！默认样式导航栏隐藏在浏览器左边，并且位置不随滚动条的滚动而改变位置，当鼠标经过导航栏时，导航栏各栏内容依次出现。CSS部分这个貌似被狗啃了一样的排版是因为我不知道怎么把它截图截好，所以就只能放在一起，效果没问题就好，反正我怀疑也就我自己看自己写的这些东西，所以我开心就好。JQ部...
2018-10-12 17:43:57
830
2
原创 京东轮播图——点击轮播
京东轮播图——点击轮播完成效果如下点击左右按钮可以实现图片转化，底下橙色的按钮也随之改变。（图片是在京东上找的，只是觉得比较好看而已）DIV布局1、整体的一个div容器2、image布局div3、左右按钮的div4、底部tab的divCSS布局1、设置整体容器的宽高，洗衣机相对位置2、设置图片透明图及宽高，当前显示图片透明度为1，其他图片为0.3、设置左右按钮位置，背景颜...
2018-09-25 21:39:22
2160
原创 PyCharm安装完成后打不开
PyCharm安装后打不开工欲善其事，必先利其器。买了个网课，今天开始跟着学习python，网课老师上来说让安装个专业版的pycharm，说是使用社区版的话以后可能会遇到一些实际情况和视频不符的情况，所以就开始了我痛苦的时光。在网上找了个pycharm的安装教程，然后看见很多人说pycharm需要购买，但是万能的网友们已经找到了破解的办法。先在官网上根据自己电脑的实际情况下载合适的pych...
2018-09-18 21:41:33
48776
16
原创 HTML画布————Canvas(1)
之前决定每周都要发一篇博客，来记录一下自己的学习情况，但是最近都在看网上的Vue.js的教程，实在是不知道写什么好，看了看上次写的关于Canvas的部分太少，那么今天就来补充一下。 立一个flag，以后每周都要发一篇博客！！1、认识canvas元素 1.1、在页面中添加canvas元素 如果要向页面中添加一个canvas，可以直接如下图所示添加。默认情况，会产生一个宽300像素，高150...
2018-09-16 10:55:28
650
原创 canvas雨滴
canvas绘图基础前提工作 1.让canvas元素占满整个你所需要显示的元素中（如果要使用canvas占满整个浏览器，可在控制台中，输入window，在弹出的文字部分中，查找innerWidth、innerHeight，这就是浏览器的宽高）2.给canvas设置一个宽高属性（给canvas元素的宽高设置100%不能完全占满整个界面）设置属性时，我们设置的是可视区的大小；设置样式时，...
2018-09-03 22:09:56
401
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人