- 博客(47)
- 资源 (2)
- 收藏
- 关注
RSS订阅原创 vertical-align学习笔记
vertical-align 支持的四种类型(支持inherit 继承) - 数值百分比类 vertical-align起作用的前提 vertical-align应用于inline水平和table-cell元素 - block不生效 - 间接改变元素属性，vertical-align也会失效，如float，absoulate table-cell(作用于自
2018-03-04 20:02:37
657
原创 relative学习笔记
relative对absolute的限制作用：限制left/top/right/bottom定位： 父元素使用了relative定位后，使用了absolute的子元素无法越过父元素进行定位；限制z-index层级： 使用了relative定位的同级元素，其本身的z-index值将决定其子元素的z-index层级；限制在overflow下的嚣张气焰： 子元素设置了absolute定位时，其
2018-03-04 20:01:59
983
原创 padding学习笔记
对于inline元素padding影响水平尺寸 不影响垂直 但是影响背景色inline水平元素的padding百分比值 同样相对于宽度计算默认的高度宽度细节有差异padding会断行inline就算是空白元素，padding高和宽也不想等 是因为：inline元素的垂直padding会让“幽灵空白节点”显现，也就是规范中的”strut”出现。对于block元素即使是设了box-s
2018-03-04 20:01:17
516
原创 overflow学习笔记
overflow当overflow-x 与 overflow-y值相同时 ，等同于overflow当overflow-x 与 overflow-y值不相同时，且其中一个值为visible,另一个被赋予，hidden,auto,scroll那这个visvible会被重置为auto; overflow: 作用前提非 display: inline 水平对应方位的尺寸限制: width/hei
2018-03-04 20:00:45
388
原创 margin学习笔记
margin与可视尺寸 滚动容器上下留白，非Chrom浏览器底部不留白（padding上下边距设置无效）此时应使用margin margin与百分比单位 margin 重叠 宽高 2:1 margin 重叠 margin重叠的计算规则 善用margin重叠margin:auto * 高度无法自动填充 margin 负值定位
2018-03-04 20:00:15
496
原创 line-height学习笔记
line-height定义,又称行高 line-height 两行文字之间基线（或中线，或顶线）之间的距离，不是指行间距不同的字体 基线位置也不一样不同的语言基线是不一样的 line-height为零，两行文字重合通常我们说：line-height 可以使单行文本自动垂直居中（事实上并没有垂直居中，而是稍偏下，具体缘由见下回分解）图片也是属于文本，当文本字体是14px时，通过l
2018-03-04 19:59:34
258
原创 float深入学习笔记
float的设计初衷： 仅仅是为了实现文字环绕效果float的感性认知：包裹性： 1. 收缩：元素应用了float后，宽度收缩，紧紧地包裹住内容（即元素的宽度收缩到元素内的内容的宽度大小） 2. 坚挺：原来没有高度，但元素应用了float后，元素的高度突然扩展到内容的高度大小 3. 隔绝：元素应用了float后，盒子里面的内容发生了任何事情，都与盒子外的内容无关（BFC） 破坏性： 1.
2018-03-04 19:58:57
226
原创 border深入学习笔记
border-style属性设置一个元素的四个边框的样式。此属性可以有一到四个值。实例: border-style:dotted solid double dashed; 上边框是点状 右边框是实线 下边框是双线 左边框是虚线double的妙用绘制菜单图形 <div class="a"></div>.a{width:40px; height: 6px;border-top:
2018-03-04 19:58:14
180
原创 absolute深入学习笔记
absolute与float的兄弟关系：都具有包裹性（父元素应用绝对定位后，父元素的宽度会收缩，但保持包裹住子元素的状态）都具有破坏性（子元素应用绝对定位后，父元素的高度会塌陷）absolute与relative：当子元素只是浮动到父元素的左上角（left:0; top:0;）处时，父元素不必设置 position: relative; ，子元素直接设置 position: absolute
2018-03-04 19:57:13
763
原创 常用meta整理
常用meta整理 <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <meta name="renderer" content="webkit" /> <meta name="viewport" content="width=device-width, in
2018-03-04 19:48:03
604
原创 php获取设备信息
php 获取服务器详细信息的方法获取系统类型及版本号： php_uname() (例：Windows NT COMPUTER 5.1 build 2600)只获取系统类型： php_uname('s') (或：PHP_OS，例：Windows NT)只获取系统版本号： php_uname('r')获取PHP运行方式： php_sapi_name()
2017-07-20 14:05:27
2319
转载 JS常用正则表达式表单验证代码大汇总
正则表达式使用详解简介简单的说，正则表达式是一种可以用于模式匹配和替换的强有力的工具。其作用如下：测试字符串的某个模式。例如，可以对一个输入字符串进行测试，看在该字符串是否存在一个电话号码模式或一个信用卡号码模式。这称为数据有效性验证。替换文本。可以在文档中使用一个正则表达式来标识特定文字，然后可以全部将其删除，或者替换为别的文字。根据模式匹配从字符串中提取一个子字符串。可以用
2017-06-10 21:01:57
658
1
原创 js 动画效果三大家族
offsetHeight: 元素高，height+border+paddingoffsetWidth: 元素宽，width+border+paddingoffsetTop: 上边距离带有定位的父盒子的距离（重要）offsetLeft: 左边距离带有定位的父盒子的距离（重要）offsetParent: 最近的带有定位的父盒子scrollHeight
2017-04-03 16:26:23
954
原创 js 运动相关属性
// 缓动公式 var leader = 0, target = 0; setInterval(function(){ leader = leader +(target - leader ) / 10; cloud.style.left = leader + "px";}offsetWidth offsetHeight得到对象的宽度
2017-03-10 09:38:32
488
转载 css常见布局方式
布局是CSS中一个重要部分，本文总结了CSS布局中的常用技巧，包括常用的水平居中、垂直居中方法，以及单列布局、多列布局的多种实现方式（包括传统的盒模型布局和比较新的flex布局实现），希望能给需要的小伙伴带来一些帮助。目录1. 常用居中方法1. 水平居中2. 垂直居中 单列布局 二列&三列布局0. float+ma
2017-03-08 15:39:42
661
原创 Date对象常用方法
/****************************************************************************** 四种构造函数重载方法 **********************************************************************
2017-03-08 11:25:06
3880
原创 表单验证常用正则表达式
QQ手机昵称密码邮箱var g = function(id){return document.getElementById(id);}var changed = function(id, fn){g(id).onchange = fn;}var setNextHtml = function(id, html){g(id).nextSibling.
2017-03-07 21:07:40
1414
原创 JQuery常用操作
目录】 一、选择网页元素 二、改变结果集 三、链式操作 四、元素的操作：取值和赋值 五、元素的操作：移动 六、元素的操作：复制、删除和创建 七、工具方法 八、事件操作 九、特殊效果【正文】一、选择网页元素jQuery的基本设计思想和主要用法，就是"选择某个网页元素，然后对其进行某种操作"。这是它区别于其他Javascript库的根本
2017-03-07 20:37:55
279
转载 DOM0级事件处理和DOM2级事件处理
0级DOM分为2个：一是在标签内写onclick事件 二是在JS写onlicke=function（）{}函数1）"myButton" type="button" value="Press Me" onclick="alert('thanks');" >2）document.getElementById("myButton").oncl
2017-03-04 20:52:09
572
原创 Array对象常用方法
//shift:删除原数组的第一项，返回删除元素的值；如果数组为空则返回undefined var arr = [1, 2, 3, 4, 5]; var out = arr.shift(); console.log(arr); //[2,3,4,5] console.log(out); //1 var arr = []; var out = arr.
2017-03-04 18:05:43
694
原创 常用 string内置方法
//concat() – 将两个或多个字符的文本组合起来，返回一个新的字符串。 var str = "Hello"; var out = str.concat(" World","!"); console.log(str); //Hello console.log(out); //Hello World! //charAt() – 返回指定位置的字符
2017-03-04 17:59:42
1379
原创 Array对象构造函数
/****************************************************************************** Array对象构造函数 *********************************************************************
2017-03-04 16:04:54
973
原创 String对象常用方法和属性
/****************************************************************************** string对象构造函数 ****************************************************************
2017-03-04 15:25:47
2016
原创 常用正则表达式大全！（例如：匹配中文、匹配html）
/* 常用正则表达式大全！（例如：匹配中文、匹配html） 匹配中文字符的正则表达式： [u4e00-u9fa5] 评注：匹配中文还真是个头疼的事，有了这个表达式就好办了 匹配双字节字符(包括汉字在内)：[^x00-xff] 评注：可以用来计算字符串的长度（一个双字节字符长度计2，ASCII字符计1） 匹配空白行的正则表达式：ns*r
2017-03-04 08:36:32
271
转载 CSS 和 Sass (SCSS) 规范
CSS and Sass (SCSS) style rulesID and class namingID和class(类)名总是使用可以反应元素目的和用途的名称，或其他通用名称。代替表象和晦涩难懂的名称。应该首选具体和反映元素目的的名称，因为这些是最可以理解的，而且发生变化的可能性最小。通用名称只是多个元素的备用名，他们兄弟元素之间是一样的，没有特别意义。
2017-02-26 14:26:31
5010
转载 JavaScript 规范
JavaScript 规范全局命名空间污染与 IIFE总是将代码包裹成一个 IIFE(Immediately-Invoked Function Expression)，用以创建独立隔绝的定义域。这一举措可防止全局命名空间被污染。IIFE 还可确保你的代码不会轻易被其它全局命名空间里的代码所修改（i.e. 第三方库，window 引用，被覆盖的未定义的关键字等等）。
2017-02-26 14:24:48
550
转载 HTML与CSS布局技巧总结
很多人对CSS的布局有困惑，实际的应用场景中由于布局种类多难以选择。今天我花些时间总结下自己对CSS布局的理解，分析下了解各种布局的优劣，同时希望能分享给初入前端的朋友们一些在布局上的经验，如果有那些地方总结的不好，欢迎大家指正。言归正传，现在就来揭开各种布局的面纱。单列布局div class="parent"> div class="child">div>div>1
2017-02-26 14:20:02
288
转载 HTML 规范
HTML 规范文档类型推荐使用 HTML5 的文档类型申明： <!DOCTYPE html>.（建议使用 text/html 格式的 HTML。避免使用 XHTML。XHTML 以及它的属性，比如application/xhtml+xml 在浏览器中的应用支持与优化空间都十分有限）。HTML 中最好不要将无内容元素[1] 的标签闭合，例如：使用 而非 <b
2017-02-26 14:18:20
494
转载 Express MVC模式理解与项目结构
文件结构app.js : 入口文件package.json : 工程信息以及模块依赖 通过npm安装模块时输入命令 : npm instal xxx –save , 会自动把模块信息保存在package.jason中node_modules : 存放模块public : 存放image , css , js 等文件routes : 存放路由文件views : 存放视图文件
2017-01-12 10:54:41
4742
转载 8.Nodejs入门-----web Socket和Socket.IO框架
web Socket和Socket.IO框架HTTP无法轻松实现实时应用：● HTTP协议是无状态的，服务器只会响应来自客户端的请求，但是它与客户端之间不具备持续连接。● 我们可以非常轻松的捕获浏览器上发生的事件（比如用户点击了盒子），这个事件可以轻松产生与服务器的数据交互（比如Ajax）。但是，反过来却是不可能的：服务器端发生了一个事件，服务器无法将这个事件的信息实时主动通知它的客户
2017-01-08 22:28:27
3187
转载 7.Nodejs入门-----Mongoose
Mongoose是一个将JavaScript对象与数据库产生关系的一个框架，object relatedmodel。操作对象，就是操作数据库了；对象产生了，同时也持久化了。这个思路是Java三大框架SSH中Hibernate框架的思路。彻底改变了人们使用数据库的方式。http://mongoosejs.com/mongoose就是: 官网上的hello world：
2017-01-08 22:25:57
321
转载 6.Nodejs入门-----写服务
ejs模式：1 //写服务2 app.get("/allstudent",function(req,res,next){3 db.find("students",{},function(err,result){4 //寻找完毕之后，result就是一个数组，说实话服务已经成功了
2017-01-08 22:23:06
349
转载 5.Nodejs入门-----Cookie和Session
Cookie和SessionCookie● HTTP是无状态协议。简单地说，当你浏览了一个页面，然后转到同一个网站的另一个页面，服务器无法认识到，这是同一个浏览器在访问同一个网站。每一次的访问，都是没有任何关系的。那么世界就乱套了，比如我上一次访问，登陆了，下一次访问，又让我登陆，不存在登陆这事儿了。● Cookie是一个简单到爆的想法：当访问一个页面的时候，服务器在下行H
2017-01-08 22:16:35
578
转载 4.Nodejs入门-----MongoDB
1.MongoDB官网：https://www.mongodb.com/手册：https://docs.mongodb.org/manual/ win7系统需要安装补丁，KB2731284。 此时，我们看一下装好的文件夹：C:\ProgramFiles\MongoDB\Server\3.0\bin 加入到系统的path环境变量中那么我们就能在系统的
2017-01-08 22:05:46
262
转载 3.Nodejs入门-----数据库
一.传统数据库技术回顾数据库就是存储数据的，那么存储数据就用txt就行了啊，为什么要有数据库？ 理由之1： 数据库有行、列的概念，数据有关系，数据不是散的。老牌数据库，比如MySQL、SQL Server、Oracle、Access。这些数据库，我们管他们叫做结构型数据库。为什么？因为每个表中，都有明确的字段，每行记录，都有这些字段。不能有的行有，有的行没有。理由二：数据库
2017-01-08 21:59:08
506
转载 3.Nodejs入门-----express框架
一、Express框架Express框架是后台的Node框架，所以和jQuery、zepto、yui、bootstrap都不一个东西。Express在后台的受欢迎的程度，和jQuery一样，就是企业的事实上的标准。 ● 原生Node开发，会发现有很多问题。比如： ■ 呈递静态页面很不方便，需要处理每个HTTP请求，还要考虑304问题 ■ 路由
2017-01-08 21:41:57
404
转载 2.Nodejs入门-----模块
Node.js中，将很多的功能，划分为了一个个mudule，大陆的书翻译为模块；台湾的书，翻译为模组。这是因为，有一些程序需要使用fs功能（文件读取功能），有一些不用的，所以为了效率，你用啥，你就require啥。1 //这个案例简单讲解http模块2 //引用模块3 var http = requir
2017-01-08 21:27:26
265
原创 1.Nodejs入门-----简介
特点:Node.js uses an event-driven, non-blocking I/O model that makes it lightweightand efficient. Node.js安装Node.js和Java非常像，跨平台的。不管是Linux还是windows编程是完全一致的（有一些不一样，比如路径的表
2017-01-08 21:12:53
382
转载 JavaScript 运动框架 Step by step
1，运动原理Js运动，本质来说，就是让 web 上 DOM 元素动起来。而想要 DOM 动起来，改变其自身的位置属性，比如高宽，左边距，上边距，透明度等。动画的原理就是把不同状态的物体，串成连续的样子，就像一本书，画了几个小人，然后一翻书，就看见小人在动。js动画也一样。不同状态的DOM，用定时器控制，就能得到动画效果。window.onload = function(){
2016-12-25 08:53:14
467
转载 移动端样式配置
/* reset */body,::after,::before { margin: 0; padding: 0; /*清除ios默认的点击时产生的高亮区块 rgba(0,0,0,0)*/ -webkit-tap-highlight-color: transparent; tap-highlight-color:transparent;
2016-12-22 16:05:33
611
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人