- 博客(17)
- 资源 (9)
- 收藏
- 关注
RSS订阅原创 原型与原型链，原理解析与应用
1、普通对象没有prototype，只有构造函数有，多用于改写公共函数；所有对象都有__proto__多用于链式查询属性2、基于__proto__向上查找的链式过程就是原型链3、原型对象可以用于存放公共方法，属性，避免内存的浪费，也可以扩展用于适用于场景
2023-05-10 17:19:46
123
原创 higntcharts-3d饼图的属性详解
1. 首先说一下自己碰到的问题是在hightcharts引入依赖的时候遇到的，如下： <script src="../js/highcharts.js"></script> <script src="../js/highcharts-3d.js"></script> <script src="../js/jquery.min.js"></script>然后浏览器会报错：研究了一下，发现是依赖引入顺序的问题，high
2021-05-27 15:37:23
1077
原创 js雪花飘落小实例
js雪花飘落其实这个小demo非常的简单，就只是运用了雪随机大小/出现位置和移动。可以练习js中操作dom的style的操作有js的时候大多数时候，都是用的js来操纵css，毕竟css只是静态页面局部，所以js的DOM对象的使用需要比较熟练涉及知识点：1、clientWdith/clientHeight元素宽高（height+padding，不包含边框），可以理解为元素可视区域高度2、伪随机函数Math.random()的很多妙用3、.style，js中的一个DOM对象，可以声明一个样式
2020-11-19 11:43:08
288
原创 js+jQuery打地鼠实例
js+jQuery打地鼠实例效果图：涉及知识点：1、display：table现在的开发环境table标签用的非常少，基本不用了：1、用DIV+CSS编写出来的文件k数比用table写出来的要小，不信你在页面中放1000个table和1000个div比比看哪个文件大2、table必须在页面完全加载后才显示，没有加载完毕前，table为一片空白，也就是说，需要页面完毕才显示，而div是逐行显示，不需要页面完全加载完毕，就可以一边加载一边显示3、非表格内容用table来装，不符合标签语义化要求
2020-11-13 20:50:52
608
原创 js-图片轮播和切换(定时器setInterval()和setTimeout())
js图片轮播和切换前两去看js和jq知识框架去了，没有写博客，总感觉少了点什么，看的差不多了今天动动手本次实例涉及到的知识点：jq选择器，定时器，js点击事件，setInterval()/setTimeout()定时器，js选择器，switch语句效果图：点击play，进行轮播，顺序从第一张到第五张，back返回第一张图，下面的数字点击分别切换队形位置的图片思路：1、img，button*6，绑定点击事件2、定时器进行轮播遇到的问题：1、点击切换对应图片开始想法比较简单，分别给每个按钮
2020-11-12 18:07:51
1330
1
原创 flex弹性盒子布局3
flex弹性盒子布局3-实例效果图思路：总体分为background，head，body，foot四部分1、background：video标签直接导入视频，设置设置z-index使视频成为背景（z-index大的在上层，可以为负）设置动画时，autoplay时播放属性，loop是循环属性autoplay 属性规定一旦音频就绪马上开始播放。如果设置该属性，则视频将循环播放。loop 属性规定当视频结束后将重新开始播放。如果设置了该属性，音频将自动播放。<video autoplay
2020-11-08 22:37:36
751
原创 flex弹性盒子布局2
flex弹性盒子布局2-子元素属性续1总结了一下父容器的各项属性，然后这里梳理一下子元素的一些属性排序语法order:<integer>integer 为一个整数，可以为负数，数值小的排在前面（也可以解决右对齐之后顺序出现的问题）.first { -webkit-order: -1; order: -1;}<div class="flex-container"> <div class="flex-item">flex item 1
2020-11-08 17:00:44
203
原创 felx弹性盒子布局1
flex弹性盒子布局1-知识梳理用多了相对绝对布局，今天这个实例实在是让我头大得很，然后用了flex原来写几十分钟的布局。十分钟不到搞定了，泪流满面，这东西真的太好用了，哭，恨自己发现的迟设置flex布局：display:flex;flex的属性：Ⅰ、flex-direction语法：flex-direction: row | row-reverse | column | column-reverserow：横向从左到右排列（左对齐），默认的排列方式。row-reverse：反转横向排列（右
2020-11-08 16:36:45
302
原创 css动画-3d旋转盒子
left:0; right:0; top:0; bottom:0; margin：auto;会使text居中，如果text没有宽高，则会继承父集的宽高。适合body 内的遮罩 3d动画记得设置3d，transform-style: preserve-3d; 重置3d中心，transform-origin:center center;
2020-11-07 22:16:55
3178
1
原创 css3百叶窗切换效果关于css代码顺序出现的错误
- 第一次遇见css代码顺序出错导致的问题！切记！我是写代码的时候发现的关于ul li:hover和ul:hover liul:hover li{ width: 30px;}ul li:hover{ width: 500px;}第一个是划过ul时 li宽变30px第二个是划过ul里面的li时 宽变500px也就是是说假定有三个元素，划过其中一个时，这个元素的width会变成500px而另外的两个元素width会变成30px效果是这样：⭐！所以这里的代码顺序很重要，如果把li:ho
2020-11-07 11:26:31
137
原创 html5+css3-图片切换(js和label)
html5+css3-css动画实例2html5+css3-css动画实例2点击切换背景图的一个效果1、css实现css的label签可以实现2、js实现点击监听事件
2020-11-06 23:12:27
1259
原创 web前端入门之html+css实例-css动画1
web前端入门之html+css实例-css动画①学习笔记1、linear-gradient()linear-gradient(to right,red,yellow,blue,green);;linearground(方向，色1，色2，色3…，末色)相当于：linear-gradient(to right,red 0%,yellow 33.3%,blue 66.6%,green 99.9%);默认方法，颜色均分渐变：linear-gradient(to right,red 10%,yello
2020-11-06 11:12:30
207
原创 web前端入门之html+css实例⑤
web前端入门之html+css实例④实例⑤：列表练习思路效果图：总结：1、再次练习了一下浮动布局，加深一下理解2、关于无序列表，如何删除前面的样式list-style: none;与之相关，如何修改li前的黑点：1、定义为图片li{list-style: url("1.png") outside circle;}2、改颜色li{color:#f00;}具体实例可参照博客：伪类模仿 li 前面的圆点及各种符号...
2020-11-05 17:30:19
151
原创 web前端入门之html+css实例④之浮动（float与inline-block）
web前端入门之html+css实例④实例④浮动练习思路：1、背景+内含块2、顶端红线+head标题红线是图片，直接导入即可，也可以自己绘制head为图+文字两部分3、图标+文本*5因为样式都是重复的，所以直接写一个就好html<div id="one"> <img src="img/信息管家.gif" > <p>信息管家</p></div>css：.content img{ width: 95px; hei
2020-11-05 15:29:46
524
原创 web前端入门之html+css实例②
web前端之html+css实例②以下相关实例均是最原始的版本，后续优化有想法会做了再发表格表单效果图：个人思路1、背景里外两块2、输入框两个，文本框二个3、单项选择按钮，多项选择4、提交按钮...
2020-11-04 17:22:58
256
原创 web前端入门之html+css实例①
web前端之html+css实例①去年之前学过一点web前端开发，过了一年，忘得差不多了，又想找一份前端的offer，努力从头复习一下，一起进步（ps：本科在校生），适合小白，大佬勿喷以下相关实例均是最原始的版本，后续优化有想法会做了再发一个热搜推荐自己的思路：1、四个div盒子，背景层一个，标题一个，书两个2、css记得初始化重置，不然浏览器顶端会留空白，如3、第一个盒子大小颜色；第二个盒子引入图和标题文字，设置宽高，布局左对齐；第三个盒子设置宽高，引入图片文字分两列，图片边框，图片和
2020-11-04 13:56:44
736
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人