zzyhhh的博客

转载 CSS3新属性及兼容代码一览

选择器CSS3中新添加了很多选择器，解决了很多之前需要用javascript才能解决的布局问题。element1~element2: 选择前面有element1元素的每个element2元素。[attribute^=value]: 选择某元素attribute属性是以value开头的。[attribute$=value]: 选择某元素attribute属性是以value结尾的。[attr...

转载 less使用

Less2019.03.26 18:57:11字数 1808阅读 533一、 css预编译常见的css预编译器有三种：less 、 sass 、 stylus。Bootstrop使用的是less。在线编译http://tools.jb51.net/code/less2css二、 LessLess是一门css预处理语言，他扩展了css语言，增加了变量、Mixin、函数等特性，使c...

原创 vue中使用MUI组件

到github上下载MUI文件 https://dcloud.io/hellomui/拷贝下载文件的dist目录中的三个文件 到你自己创建的目录（如static中创建文件夹mui,存放拷贝的文件）3.在webpack.config.js指定的entry文件（02-mian.js）中导入mui的css文件 import ‘…/statics/mui/css/mui.css’4.使用哪种样式...

转载 HTML5和CSS3新特性一览

1.HTML5 新元素HTML5提供了新的元素来创建更好的页面结构：标签描述定义页面独立的内容区域。定义页面的侧边栏内容。允许您设置一段文本，使其脱离其父元素的文本方向设置。定义命令按钮，比如单选按钮、复选框或按钮用于描述文档或文档某个部分的细节定义对话框，比如提示框标签包含 details 元素的标题规定独立的流内容（图像、图表、照片、代码等等）。定义 ...

转载 一些常用的Bootstrap模板资源站

超级Bootstrap模板库：http://www.wrapbootstrap.com/http://www.templategarden.com/https://shapebootstrap.nethttp://thebootstrapthemes.com/免费的HTML5 响应式网页模板：http://html5up.net/WP & Bootstrap：http://...

转载 Bootstrap学习小结

栅格参数：bootstrap 其实 是把 网页等 分为 了 12分，bootstrap把 根据屏 幕 大小 把屏 幕分 为了 4个层 级，小于 768 像 素的 为超小屏 幕，大于 等于 768 像素的 为小屏 幕，大于 等于992像素的为中等屏幕，大于等于1200像素的则为大屏幕，相应的类前缀见图或查看官方文档。栅格：超小屏幕 手机 (<768px) .col-xs-小屏幕 平板 ...

原创 响应式布局思维导图小结

转载 原生JS笔记总结

1.如何区分私有变量和全局变量？ 1)在全局作用域下声明（预解释的时候上）的变量是全局变量 2)在“私有作用域中声明的变量”和“函数的形参”都是私有变量 在私有作用域中，我们代码执行的时候遇到了一个变量，首先我们需要确定它是否为私有的变量，如果是私有的变量，那么和外面的没有任何的关系；如果不是私有的，则往当前作用域的上级作用域进行查找，如果上级作用域也没有则继续查找，一直找...

转载 众妙之门：移动Web设计精髓

第一章 移动Web设计趋势1.简化选项、页面留白、少量的图片、子域将取代.mobi域名和单独域名、内容优先2.移动Web设计的挑战:屏幕尺寸多样化、缺乏理解、快速的变化、测试繁琐、做减法3.对移动Web设计的思考：简明的语义标记、CSS下内容与显示的分离、Alt 标签、表单域的分类、标题的作用、禁用漂浮链接、减少页边距和填充、做好页面导航、注意页面颜色对比4.Sitepoint(设计团队)...

转载 12款很赞的web前端移动开发框架

原生移动应用程序运行更快、更顺畅，有更好的用户体验。而同时，前端开发人员总是寻找新的 Web 技术来获得这种性能。利用现有的高质量移动框架来构建移动 Web 应用程序已成为非常容易，但是如何选择合适的框架是比较纠结的。因此在本文中，我们整理了12个很赞的移动框架。1.RedbeardRedbeard让它来创建本地应用程序没有一个样板更快和更容易。它与吨的组成部分的一个完整的框架，有一系列的准备...

转载 元素JavaScript知识点梳理与经典百例

JavaScript语法：image.pngDOM操作：image.png数据类型面向对象继承闭包插件作用域跨域原型链模块化自定义事件内存泄漏事件机制异步装载回调模板引擎JSONajaximage.pngJavaScript事件触发：onkeypress 在用户按下并放开任何字母数字键时发生。系统按钮（例如，箭头键和功能键）无法得到识别。[响应一个键...

转载 CSS伸缩布局

伸缩布局(弹性布局)display:flex给谁添加了display:flex,谁就是伸缩容器伸缩容器中的盒子,就被称为伸缩项主轴方向1.只要将一个元素变为了伸缩的容器, 那么里面的伸缩项自动就会水平排版2.默认会按照主轴从左向右的方向排版flex-direction:属性就是专门用于设置主轴的方向的,默认取值是row(从左至右)row-reverse(从右至左)flex-di...

原创 Canvas笔记

什么是Canvas？HTML5 的 canvas 元素使用 JavaScript 在网页上绘制图像。画布是一个矩形区域，您可以控制其每一像素。canvas 拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法。创建Canvas元素向 HTML5 页面添加 canvas 元素。规定元素的 id、宽度和高度： <canvas id="myCanvas" width="200"...

转载 一些html5和css3的一些常见面试题

一、HTML5 CSS3CSS3有哪些新特性？CSS3实现圆角（border-radius），阴影（box-shadow），对文字加特效（text-shadow、），线性渐变（gradient），旋转（transform）3.transform:rotate(9deg) scale(0.85,0.90) translate(0px,-30px) skew(-9deg,0deg)...

转载 H5多媒体标签

Title

转载 h5常用标签

h5常用标签2019.04.11 10:49:51字数1075阅读64一，新特性：取消了过时的显示效果标记 和 …新表单元素引入新语义标签的引入canvas标签（图形设计）本地数据库（本地存储）一些API二， 新语义标签 三，多媒体标签及属性介绍 视频 属性：controls 显示控制栏 属性：...

转载 面试问题之H5C3有哪些新特性？

H5 C3 新增h51.语义化标签header、footer、aside、section、article、nav2.表单输入类型email、url、number、range、Date Pickers、search、color3.表单属性autocomplete、placeholder、form4.视频音频video、audio5.画布canvas6.伸缩矢量图svg7....

转载 CSS总结

录Transition过渡Transition的分体属性：贝塞尔曲线cubic-bezierBody本身没有高度，html本身也没有高度，document的高度是可视区域。文字阴影HTML5新增表单控件Input在HTML5中新增了很多的类型新增表单属性属性选择器子元素选择器（结构性伪类）伪类选择器盒模型阴影box-shadow倒影box-reflect(需要加...

原创 CSS中2d3d转换

2D 转换1、translate() 方法通过 translate() 方法，元素从其当前位置移动，根据给定的 left（x 坐标） 和 top（y 坐标） 位置参数：实例div{transform: translate(50px,100px);}值 translate(50px,100px) 把元素从左侧移动 50 像素，从顶端移动 100 像素。2、rotate() 方法通...

原创 HTML5与CSS3小结

/* 结构伪类选择器 *//找到父级元素中所有的子元素， 再找第-一个子元素是p标签/p:first-child {background-color: pink;} /* 找到父级元素中所有的子元素， 再找第最后一个元素是p标签 */ p:last-child { background-color: red } /* 找到所有的子元素，再找...

原创 Ajax的概念

什么是AJAX2005年，Adaptive Path公司的JesseJames Garrett发明了Ajax这个词，他在发表的文章中给Ajax有了一个明确的定义“A new approach to web applications”，Ajax就是用于概括异步加载页面内容的技术。通过页面点击事件，不断的向服务器发送请求，然后服务器会实时的返回最新的数据，这就是AJAX的功能。作为多种思想技术的融...

转载 jquery

. class选择器id选择器: 选取$(function(){})相当于 window.onload 方法.window.onload = function(){…}加载DOM的两种方式: jQuery 和 window.onload$(document).ready(function(){…})$(function(){…}选取button 并添加 onClic...

原创 jquery插件

插件：jquery不可能包含所有的功能，我们可以通过插件扩展jquery的功能。jQuery有着丰富的插件，使用这些插件能给jQuery提供一些额外的功能。jquery.color.jsanimate不支持颜色的渐变，但是使用了jquery.color.js后，就可以支持颜色的渐变了。使用插件的步骤javascript引入jQuery文件引入插件（如果有用到css的话，需要引入cs...

原创 jquery常用属性

取值与赋值操作$("#ID").val(); //取value值$("#ID").val(“xxx”); //赋值$("#ID").text(); //相当于取innerText$("#ID").text(""); //相当于赋值给innerText$("#ID").html(); //相当于取innerHTML$("#ID").html(""); //相当于赋值给innerHTML...

原创 jQuery笔记

事件的阶段：1----捕获阶段(由外到内)2----目标阶段（当前元素）3----冒泡阶段（由内到外）获取当前事件的状态：e.eventPhase常用事件： onclick：点击元素时触发 onmouseover：鼠标移入元素时触发 onmouseout：鼠标移出元素时触发 onkeyup：键盘抬起时触发 onkeydown：键盘按下时触发 ...

原创 正式表达式及部分方法笔记

1.正则表达式：也叫规则表达式，按照移动的规矩组成的一个表达式—是来匹配字符串，** 中国移动电话10086 中国联通10010，中国电信：10000—可以写一个正则表达式匹配所有数字** 正则表达式：由元字符 或者 限定符 组成的一个式子** 1.元字符===================* 1.1 .-- 表示出了换行符以为的任意一个字符’111’ ‘,’* 1.2 []—...

原创 JavaScript 闭包小笔记

JavaScript 变量可以是局部变量或全局变量。私有变量可以用到闭包。闭包:在函数A中有一个函数B(对象B)，函数B (对象B)可以使用函数A中定义的变量和数据 此时就形成了闭包 闭包的模式：1函数模式的闭包2.对象模式的闭包 闭包的作用:缓存数据， 延...

原创 笔记：面向对象的三大特征

面向对象的三大特征：** 封装：** 继承：是一种关系，是类（class）和类之间的关系，js中没有类，但是可以通过构造函数模拟类，然后通过原型来实现继承* 继承是为了实现数据共享，js中的继承也是为了实现数据共享** 原型的作用：1.数据共享，节省空间 2.实现继承** 人：姓名，性别，年龄，吃饭。打招呼** 学生：姓名，性别，年龄，学号* 老师：姓名：性别，年龄...

原创 原型部分总结

原型：* 在构造函数中 有一个prototype属性，叫原型，也是一个对象，是给程序员用的，是标准的属性* 在实例对象中，有一个__proto__属性，叫原型，也是一个对象，是给浏览器用的，不是标准属性，一般不用** 在 构造函数中的prototype 中添加的属性和方法，实例对象可以直接调用* 正常的写法:实例对象.proto.属性-----》实例对象.属性** 本身在构...

原创 offset系列、scroll系列、client系列~

offset系列：offsetWidth：获取元素的宽(包含边框)offsetHeight：获取元素的高(包含边框)offsetLeft：获取元素距离左边的值offsetTop：获取元素距离右边的值scroll系列：scrollWidth:元素中内容的实际的宽（没有边框），如果没有内容或是内容不足就是元素的宽scrollHeight:元素中内容的实际的高（没有边框），如果没有内...

原创 轮播图

定时器setTimeout()和clearTimeout()在指定的毫秒数到达之后执行指定的函数，只执行一次// 创建一个定时器，1000毫秒后执行，返回定时器的标示var timerId = setTimeout(function () { console.log('Hello World');}, 1000);// 取消定时器的执行clearTimeout(timerId)...

原创 元素相关

父元素. appendChild(新元素对象)-----向后追加元素父元素. insertBefore(新元素对象,参考元素对象)----在参考元素对象前插入新创建的元素父元素. replaceChild(新元素对象，参考元素对象)----将新元素对象替换参考元素对父元素。removeChild (要删除的元素)...

原创 创建元素的三种方式和innerHTML的

获取元素的方式： document.getElementById('id') document.getElementsByTagName('标签名')----- getElementsByClassName('类名')----- getElementsByName('name属性值')----- qu...

原创 节点操作兼容

innerText textContent 都可以获取或者设置双标签的文本内容textContent:谷歌， 火狐浏览器都支持，ie8不支持innerText:谷歌，火狐，ie8都支持如何判断浏览器支不支持这个属性? 判断这个属性的类型是不是undefined,就可以知道是否支持innerText和innerHTML 都可以获取文本内容区别: innerText只能获取普通文本内容...

原创 Web前端

一、 获取元素的方式： 1. 通过id获取元素 document.getElementById('id名')；-----返回一个对象 2. 通过标签名获取元素 document.getElementsByTagName('标签名')----返回多个元素组成的集合【伪数组】 3. 通过name属性获取元素 document.g...

原创 jsDOM

ebAPI:浏览器提供了一套操作浏览器功能和页面元素的API API:预定义的函数或方法 供用户调用 javaScript由3个部分组成： ECMAscrpt:js语法基础 BOM：浏览器对象模型 browser object modal 操作浏览器的一些API： 弹框，地址栏，历史记录 DOM：文本对象模型 document object mod...

原创 数组与字符串

reolace(字符串/正则表达式,要替换的字符串)slice(开始索引,结束索引)-----截取开始索引到结束索引(不包含结束索引)这个范围的字符串,如果结束索引省略,截取开始索引到字符串结束的所有字符串,如果开始索引为负值,那么开始索引为负值,那么开始索引为字符串长度+负值substring(开始索引,结束索引)split(分隔字符串,[数组的长度])----通过分隔字符串，将字符串对...

原创 内置对象

JavaScript中的对象分为3种：内置对象、浏览器对象、自定义对象JavaScript 提供多个内置对象：Math/Array/Number/String/Boolean…对象只是带有属性和方法的特殊数据类型。Math对象Math对象不是构造函数，它具有数学常数和函数的属性和方法，都是以静态成员的方式提供跟数学相关的运算来找Math中的成员（求绝对值，取整）...

原创 对象创建方式

对象字面量var o = {name: ‘zs’,age: 18,sex: true,sayHi: function () {console.log(this.name);}};new Object()创建对象var person = new Object();person.name = ‘lisi’;person.age = 35;person.job = ‘actor...

原创 函数其他

1.命名函数: 有名字的函数匿名函数:没有名字的函数 2.匿名函数: function(){ } 3.函数的另一种定义方式: var 变量名 = function(){ } var 变量名 =[];判断变量的数据类型:typeof 函数也是一种数据类型:类型是function ----object js中的类型:number ...