- 博客(30)
- 收藏
- 关注
RSS订阅原创 github基本操作整合
github 操作初始创建本地项目mkdir 项目目录cd 项目目录git init创建github库github 新建repositories （点开github头像中的my responsitories ，new新建）git 将本地数据与仓库关联 (代码在新建仓库的完成页面中)git remote add origin git@github.com:yw...
2020-04-22 21:32:21
368
转载 vue-router hash模式
URL中的hash（井号） </h1> <div class="clear"></div> <div class="postBody"> 1.#的含义#代表网页中的一个位置，其右边的字符，就是该位置的标识符。比如http://www.exa...
2020-04-15 17:48:43
2538
原创 无缝轮播
实现效果点击下一张时，图片无缝轮播到下一张，圆圈也颜色变到对应的位置，并且其他圆圈颜色为蓝色。当点击圆圈中某一个时，图片轮播展示对应的图片。css 样式<style> * { margin: 0; padding: 0; } div { width...
2019-12-23 01:24:55
184
原创 Dom事件总结
dom常用事件总结鼠标事件事件名 作用 Element.onclick 元素被点击时，触发事件 Element.ondblclick 双击时调用 Element.onmousedown 鼠标按下时，触发事件(左键右键都可以) Element.onmouseup 鼠松开时，触发事件 Element.onmouseseenter 鼠标移上...
2019-12-22 16:43:50
132
原创 Tab选项卡（js）
实现效果与思路今天来实现一个常用的功能tab选项卡。下图是基本的样式，当点击不同的选项卡标签时会展示不同的选项卡内容。实现原理是首先给每个选项卡内容都隐藏，当点击选项卡时使其对应的内容显示就实现了tab选项切换的功能。具体代码实现1. 样式实现<style> button{ //选项卡按钮 ...
2019-12-22 11:44:15
2927
1
原创 轮播
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...
2019-12-16 03:26:18
114
原创 点名器
点名器的思路是随机获取到指定数组中的姓名字符串，点击显示框开始随机出现姓名，点击停止按钮时停止并得到随机的姓名 。随机产生：使用 random 乘以数组长度减一再取整即可得到数组index的随机数。Math.round(Math.random() * (yname.length - 1));点击开始旧让定时器进行重复循环，快速给出不同的姓名。停止点名：清除定时器即可出现的问题：当我们重复点...
2019-12-16 03:23:10
1156
原创 Dom总结
- 什么是DomDom全称为Documennt Object Moduel 意为文档对象模型，DOM 定义了访问 HTML 和 XML 文档的标准：W3C 文档对象模型 （DOM） 是中立于平台和语言的接口，它允许程序和脚本动态地访问和更新文档的内容、结构和样式。W3C DOM 标准被分为 3 个不同的部分：- 核心 DOM - 针对任何结构化文档的标准模型- XML DOM - 针对 ...
2019-12-15 22:44:17
149
原创 this指向
什么是this this可以为函数指向所有者，当函数作为对象属性时，将对象属性的函数叫做对象 方法，而对象就是该函数方法的所有者。this作用 this用来调用对象属性，引用函数的所有者。this用法第一步：看this在哪里1. 在全局作用域中 this 指向 window注意：函数中 严格模式下 没有执行的时候先指向undefined，因为函数此时没有执行环境，在被调用的...
2019-12-08 21:44:47
136
原创 闭包与作用域
什么是闭包闭包是指 一个函数嵌套一个内部函数，这个内部函数可以在外部函数体外调用外部函数内的变量 。通俗的说就是一个原来在函数a体内的函数b被调用在函数a体外执行并且b函数还可以调用a函数体内的变量。一般函数与闭包函数的区别：一般函数的内部函数如果在其嵌套的函数的函数体外运行并调用嵌套函数的变量是不被允许的。 因为此时的内部函数不再是嵌套函数的局部变量可以随意使用大...
2019-12-08 19:09:15
309
原创 作用域作用域链变量函数提升
1、作用域 作用域经常被用来配合js引擎去查询访问权限。比如js引擎想要调用某一个变量就会先询问作用域自己能否取到该变量。得到作用域的许可后再由编译器编译生成相应代码。引擎负责从头到尾整个js程序的编译和执行过程。 所以作用域是负责收集、维护由所有声明的标识符（变量）组成的一系列查询，并实施一套非常严格的规则，确定当前执行的代码对这些标识符的访问权限。作用域定义： [[scope]]...
2019-12-01 23:09:48
153
原创 js生成随机6位数验证码
假设验证码由26个大写字母和26小写字母还有数字0-9的62位字符串组成var vertifyOrg = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789'得到六位随机数 for(var i = 0;i<6;i++){vertifyOrg[random]}将每一个循环得到的随机字符存到验证码中 var ve...
2019-11-27 21:02:27
3334
原创 js类型转换总结
js类型分类 js的分为两种数据类型：基本数据类型和引用数据类型。 - 基本数据类型：String Number Boolean null undefined NaN - 引用数据类型：object对象 arry数组 function函数 正则表达式RegExp 日期Date -不同数据类型的存放方式 基本数据类型大小固定，不会动态增加，所以基本数据类型的数...
2019-11-22 22:41:59
285
原创 js判断100以内质数的三种方法
写个实现100以内输出质数的三种方式。质数是除了能被自身和1整除外不能被第三个数整除，1除外。思路都是正向的想法，将100以内每一个数字除以小于其自身的数，判断是否能被其他数整除即可。因为除以一个大于自身的数完全没有意义，永远不会被整除第一种方法（没有优化的）首先定义两个变量，初始值都为0，为了后面输出有多少个质数；第一层循环每个需要判断的值 i，在第二层循环中让 i 被每个不大于自身的...
2019-11-22 20:41:48
4552
1
原创 css面试题
用纯CSS创建一个三角形的原理是什么？** 使用一个边框实现， 将三个边框设置宽度背景颜色为透明，一个边框设置为有颜色有宽度absolute的containing block计算方式跟正常流有什么不同？ 包裹决定定位元素的父容器必须是具有position属性为absolute或者relative。 父元素为absolute会脱离文档流 ，父元素为relative不...
2019-11-18 22:37:26
133
原创 只使用frame实现多个页面的跳转
今天主要实现在同一个页面中不使用js进行页面的跳转。首先将一个页面分为两部分，左边放置选则跳转的a标签，右边放需要跳转的内容。右部分具体实现<div class="right"> <iframe src="a.html" name="a" frameborder="0"></iframe> </div>...
2019-11-17 22:45:00
1378
原创 栅格系统
栅格系统栅格系统 是横向布局的处理方式，使用起来非常方便适应ie8以上的版本，今天仿照bootstrap写一下基础的栅格系统。容器 类名.row将栅格布局中所有的元素浮动，便于布局。 如果用户自定义自己的父容器，不使用.row父容器 ，那么将需要自己清除浮动，计算父容器高度。bootsrap3是将.row 容器等份12份 我们也仿照进行12份。浮动后元素变为行内块，所以元素内需要添加内容...
2019-11-17 22:13:13
345
原创 transition实现行星运转
话不多说，刚代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-...
2019-11-16 17:54:16
126
翻译 css3 伪类child详解
话不多说，代码刚起来。 <nav > <ul> <li>item01</li> <li>item02</li> <li>item03</li> <li>item04</l...
2019-11-16 16:42:44
672
原创 解决浏览器兼容性问题hack
hack主要解决低版本 ie 6、7、8兼容性问题 更高版本的浏览器出现的兼容性问题最好不要使用hack来解决，因为hack只是通过在低版本中声明了CSS 一些特殊的符号，让不同的浏览器识别不同的符号（什么样的浏览器识别什么样的符号是有标准的，CSS hack就是让你记住这个标准），以达到应用不同的CSS样式的目的（原本该版本中不兼容的）从而达到能够使用的目的，但是后面的更新的版本如果兼容了该标签...
2019-11-12 20:52:19
284
转载 精灵图片
目录一、名词解释二、使用难点三、使用步骤四、程序源码一、名词解释 在网页中，我们可以看到有很多的小图标，比如微博上的登录位置有很多这样的小图标。因为浏览器显示网页的所有内容都需要从我们自己的服务器进行下载，如果将这些图标分别存在服务器上，那么当需要显示的时候将会发出很多次...
2019-11-12 20:24:34
261
转载 关于html页面知识点总结
<!DOCTYPE html> <html lang="en">Web 世界中存在许多不同的文档。只有了解文档的类型，浏览器才能正确地显示文档。此处加上html 是为了声明此文件为HTML文件HTML 也有多个不同的版本，只有完全明白页面中使用的确切 HTML 版本，浏览器才能完全正确地显示出 HTML 页面。这就是 <!DOCTYPE> 的用处。<...
2019-11-12 20:20:54
237
原创 css模糊知识点总结
一、定宽居中在很多的电商网页中导航条和内容都是居中对齐的，比如华为的商城，此时我们就可以用到定宽居中来实现这种效果。1. 原理将元素固定宽度，通过为元素添加样式 margin-left | margin-right：auto，利用自身的外边距实现元素对于父容器中的左右居中2. Tips首先应该先定宽，将自身宽度固定才能实现居中效果。块级元素如果不设置自身的宽度就会默认为100%父元素...
2019-11-12 09:04:37
107
原创 css基础之3D旋转
3D旋转的定义学过美术的都应该知道，在平面中实现看出来是3D的效果就必须用到透视。css中定义3D的方式是transform-style:<flat|preserve-3d>属性。前者flat为默认值，表示平面的；后者preserve-3d表示3D透视。元素样式中添加transfrom：perspective属性。无透视不3d;透视还需要一个视点perspective。视点就是能...
2019-10-25 09:41:45
1482
原创 css布局之弹性布局flex
1. 弹性布局作用作用：弹性布局flex能按照我们的设置自动计算各子元素之间的间距并将之布局好，而不需要像定位那样手动计算布局。2.弹性布局的定义和属性弹性布局是定义在一个父容器中，加上display：flex样式使父容器的布局方式成为弹性布局。父容器中的子元素都会成为行内块，默认所有子元素横向排列，子元素的float、clear和vertical-align属性将失效。但是position...
2019-10-24 23:59:53
1221
原创 使用边框画圆深入理解border-radius
在css中经常会用到border-radius来画一个圆圈的效果。但是之前并不知道为什么。今天就深入研究一下。什么是radiusradius，半径的意思。结合border边框属性，边框的半径是啥意思呢？个人的理解是给边框一个弧度，radius就是这个弧度半径的值。像下面这样。所以如果想要画一个圆只需要将div的宽度=2*radius即可实现圆的效果。border-radius的分类大家...
2019-10-23 20:59:21
2292
原创 布局
弹性布局使用方式重点：微信；微信小程序；各个小程序优先弹性布局使用规则：1：找到父容器：给父容器设置display：flex2:一旦容器变为flex布局，主轴 与 交叉轴就会存在（你用不用都存在）3：确定主轴方向：flex-deriction 默认水平方向 从左往右---->决定子元素横向的排列4：在主轴上怎么排列--------->justify-content 决定 左对...
2019-10-21 09:53:39
104
原创 CS基础知识之定位
基础布局方法position定位1、定位分类position：相对定位 relative绝对定位 absolute固定定位 fixed2、定位用法相对定位：相对与自身原本的位置进行定位不会脱离文本流，自身的位置任然保留绝对定位：相对于不是有position属性的父容器进行定位。如果父容器的父容器的父容器…一直没有position属性就相对于body进行定位。固定定位：固定在浏览...
2019-10-21 09:51:56
1195
原创 基础知识之浮动
本人前端小白一枚，正在自学前端希望利用博客记录并深入挖掘前端的知识。首先从浮动开始。浮动的作用CSS 的 Float（浮动），会使元素向左或向右移动，其周围的元素也会重新排列。Float（浮动），往往是用于图像，但它在布局时一样非常有用。比如在一个大div中有两个靠左右的布局时就可以使用浮动。浮动使用方法：style{.divv{`float：<right>||<le...
2019-10-21 08:16:47
113
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人