自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(57)
  • 收藏
  • 关注

原创 swiper(滑动) 快速使用

1.首先加载插件,需要用到的文件有swiper.min.js和swiper.min.css文件。2.HTML内容。<!DOCTYPE html><html><head><link rel="stylesheet" href="path/to/swiper.min.css"></head>&

2017-07-05 17:35:55 400

原创 鼠标事件

鼠标事件是Web 开发中最常用的一类事件,毕竟鼠标还是最主要的定位设备。DOM3 级事件中定义了9 个鼠标事件。         click:在用户单击主鼠标按钮(一般是左边的按钮)或者按下回车键时触发。这一点对确保易访问性很重要,意味着onclick 事件处理程序既可以通过键盘也可以通过鼠标执行。         dblclick:在用户双击主鼠标按钮(一般是左边的按钮)时触发。这个...

2017-06-27 17:06:27 167

原创 css bug问题处理方法

        最简单的一些css问题是由代码中的打字和语法错误造成的。 例如在声明末尾忘了加分号,或者在输入的时候输入错误。解决方法:选择一个包含语法突出显示和代码补全功能的css编译器。自己写代码的时候也多注意。1、特殊性和分类次序的问题       在将一个规则应用于一个元素时,如果发现没有效果,这是往往存在特殊性问题。       例如把内容中所有段落的背景颜色设置为白色,...

2017-06-26 17:41:25 145

原创 css 知识点总结

css知识点总结1.从css样式代码插入的形式来看基本可以分为以下3种:内联式、嵌入式和外部链接式三种。    a.内联式css样式:          <p style="color:red;font-size:12px">这里文字是红色。</p>    b.嵌入式css样式:  <style type="text/css"&gt...

2017-06-22 15:57:26 177 1

原创 less 基本使用

less是什么    less是一种动态样式语言,属于css预处理语言的一种,类似于css的语法,为css赋予了动态语言的特性,如变量、继承,运算,函数等,更方便css的编写和维护。less的编译工具    我前端开发使用的是HBuilder编译工具,在HBuilder中提供了less的编译插件。打开工具--安装插件里面有less、scss编译插件点击安装;     打开工具中...

2017-06-20 15:24:50 155

原创 css选择器--伪类、伪元素

css的元素选择除了id(#),class(.),属性([])外,还有伪类和伪元素。跟id选择器、类选择器、属性选择器等这些从html文档层次中获取元素不同的是,伪类和伪元素是预定义的、独立于文档元素的,它们获取元素的途径也不是基于id、class、属性这些基础的元素特征,而是在处于特殊状态的元素(伪类),或者是元素中的特别的内容(伪元素)。伪类和伪元素的表现形式也使用“:”(英文冒号)与其它选...

2017-06-16 17:59:00 173

原创 点击加载更多内容

基本原理:页面载入时,向后台请求数据,PHP通过查询数据库将最新的几条记录显示在列表页,在列表页的底部有个“更多”链接,通过触发该链接,向服务端发送Ajax请求,后台PHP程序得到请求参数,并作出相应,获取数据库相应的记录并以JSON的形式返回给前台页面,前台页面jQuery解析JSON数据,并将数据追加到列表页。其实就是Ajax分页效果。 1.引入jquery库和jquery.mor...

2017-06-15 18:42:23 1306

原创 echarts 基本使用

     最近项目需要做一下数据展示,在网上搜索了一下发现了echarts,没有接触过,正好学习一下。想要使用它主要有几个步骤:      1. 首先去官网下载一个echarts.js文件,把它引入;      2.在绘制我们想要的图之前的需要一个有宽高的容器;      3.通过echarts.init方法初始化一个echarts实例并通过setoption方法生成一个简单的图;...

2017-06-14 18:11:34 142

原创 百度地图使用心得

1 在使用百度地图是,首先的申请密钥(ak)才能成功加载API JS文件。       ak的使用方法:<script src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥" type="text/javascript"></script> 2 移动端使用地图:        将地图容器高设置为100%...

2017-06-14 17:44:57 171

原创 validfrom 表单验证的使用心得

首先引入 validform.js文件html代码      <form id="form">       <input id="name" placeholder="请输入真实姓名" type="text" datatype="*" errormsg="请填写用户名">       <input

2017-06-14 17:44:44 1088

原创 web前端代码规范

html页面原则:    1.保证代码规范,结构表现行为相互分离,有一套html规范。    2.保证代码的最简化,避免多余的空格、空行,保持代码的语义化,尽量使用具有语义的元素,避免使用样式属性和行为属性。任何时候都要用尽量简单、尽量少的元素解决问题。    3.按照标准,但是不能违背实用性。    4.开发同一个项目时,共用一套代码规范,这样就像是一个人写的 页面规范...

2017-06-14 17:32:07 108

原创 coffeeScript

CoffeeScript 是一门编译到 JavaScript 的小巧语言. 在 Java 般笨拙的外表下, JavaScript 其实有着一颗华丽的心脏. CoffeeScript 尝试用简洁的方式展示 JavaScript 优秀的部分.CoffeeScript 的指导原则是: "她仅仅是 JavaScript". 代码一一对应地编译到 JS, 不会在编译过程中进行解释. 已有的 Java...

2017-03-08 14:41:05 120

原创 angularjs Scope

一、什么是Scope?  scope(http://code.angularjs.org/1.0.2/docs/api/ng.$rootScope.Scope)是一个指向应用model的object。它也是expression(http://www.cnblogs.com/lcllao/archive/2012/09/16/2687162.html)的执行上下文。scope被放置于一个类似应...

2017-03-06 15:53:32 101

原创 angular.js 表单验证

构建一个ng表单1.确保form上标签有一个name属性,像下面的例子一样。最好再加一个novalidate=”novalidate”2.form中不能有action属性。提交交由ng-submit处理3.每个input一定要有ng-model,最好有一个name方便引用。然后用require或者ng-minlength之类才起作用<form name="form" nov...

2017-03-02 17:17:11 114

原创 angular.js 服务(Service)

AngularJS中为我们提供了众多的内置服务,通过这些内置服务可以轻松的实现一些常用功能。下面对Angular中常用的内置服务进行一下总结。1.$location服务$location服务解析在浏览器地址栏中的URL(基于window.location)并且让URL在你的应用中可用。改变在地址栏中的URL会作用到$location服务,同样的,改变$location服务也会改变浏览器的...

2017-02-27 15:29:46 137

原创 angular.js 过滤器

AngularJS的filter(过滤器)是用来过滤变量的值,或者格式化输出,得到自己所期望的结果或格式。 过滤器可以使用一个管道字符(|)添加到表达式和指令中。例如:<p>姓名为 {{ lastName | uppercase }}</p> //将字符串格式化为大写 一.模板中使用过滤器在表达式中应用Filters (过滤器)需要遵循格式如下...

2017-02-24 17:33:56 142

原创 angularjs 控制器

控制器在Angularjs中的作用是增强视图,它实际就是一个函数,用来向视图中的作用域添加额外的功能,我们用它来给作用域对象设置初始状态,并添加自定义行为。当我们在页面上创建一个控制器时,Angularjs会生成并传递一个$scope给这个控制器,由于Angularjs会自动实例化控制器,所以我们只需要写构造函数即可。下面的例子展示了控制器初始化:var myApp=angular.m...

2017-02-24 14:48:30 73

原创 angular.js Bootstrap

你可以在你的 AngularJS 应用中加入 Twitter Bootstrap,你可以在你的 <head>元素中添加如下代码:<link rel="stylesheet" href="//apps.bdimg.com/libs/bootstrap/3.3.4/css/bootstrap.min.css"> angular.js  Bootstrap 实例:...

2017-02-24 11:14:32 161

原创 angular.js 指令

AngularJS 指令AngularJS 指令是扩展的 HTML 属性,带有前缀 ng-。ng-app 指令初始化一个 AngularJS 应用程序。ng-init 指令初始化应用程序数据。ng-model 指令把元素值(比如输入域的值)绑定到应用程序。 ng-app 指令ng-app 指令定义了 AngularJS 应用程序的 根元素。ng-app 指令在网页...

2017-02-23 17:56:33 92

原创 angular.js 依赖注入

 理解AngularJS中的依赖注入AngularJS中的依赖注入非常的有用,它同时也是我们能够轻松对组件进行测试的关键所在。在本文中我们将会解释AngularJS依赖注入系统是如何运行的。 AngularJS 提供很好的依赖注入机制。以下5个核心组件用来作为依赖注入:         service         provider         value...

2017-02-23 16:00:40 101

原创 angularJS 路由

   AngularJS 路由  AngularJS 路由允许我们通过不同的 URL 访问不同的内容。1.首先需要在页面引入angular和angular-route,注意要在angular-route之前引入angular<script src="https://cdn.static.runoob.com/libs/angular.js/1.4.6/angula...

2017-02-23 11:16:07 162

原创 jquery.validate表单验证

表单验证:<div class="register-step-one"><form id="register-cnt"><div class="title">免费注册用户</div><ul><li><div class="re

2016-12-19 15:59:41 84

原创 document 对象

document对象详解对象属性document.title //设置文档标题等价于HTML的title标签document.bgColor //设置页面背景色document.fgColor //设置前景色(文本颜色)document.linkColor //未点击过的链接颜色document.alinkColor //激活链接(焦点在此链接上)的颜色document.vlinkColor...

2016-05-30 11:09:56 61

原创 css3 基础总结

Css3学习随笔 在编写css3样式时,不同的浏览器 需要不同的前缀,为了更好的兼容还是需要:           前缀              浏览器         -webkit      Chrome和Safari         -moz         Firefox      ...

2016-05-03 11:00:09 180

原创 HTML5 基础总结

HTML5基础随笔1视频Video视频标签,视频格式1).Ogg格式   <video src=”movie.0gg” controls=”controls”></video>2)mpeg4格式   <video src=”movie.mp4” controls=”controls”></video>示例:<v...

2016-05-03 10:49:15 104

原创 WebStorm,rubyMine,phpStorm,pyCharm注册码

WebStorm,rubyMine,phpStorm,pyCharm注册码 webStorm : UserName:William ===== LICENSE BEGIN ===== 45550-12042010 00001SzFN0n1bPII7FnAxnt0DDOPJA INauvJkeVJBuE5bqLEznccE4tet6tr RiyoMxDK8oDY93tx!i...

2016-03-04 15:49:52 84

原创 CSS中cursor的pointer 与 hand

cursor的pointer 与 hand区别:cursor:hand 与 cursor:pointer 的效果是一样,都像手形光标。但用FireFox浏览时才注意到使用cursor:hand在FireFox里并被支持。cursor:hand :IE完全支持。但是在firefox是不支持的,没有效果。cursor:pointer :是CSS2.0的标准。所以firefox是支持的,但是IE5...

2016-03-04 15:42:54 144

原创 固定栏

<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>固定栏</title> <script src="js/jquery_1.9.js"&

2015-10-26 16:24:15 97

原创 构建一个简单的web页面

1. 构建HTML 构建HTML是整个过程最基础的部分。我们构建HTML比较关键的一个原则就是“还HTML标签其本来的含义”。所以在这里,我们应该合理分析一下期望做到的HTML的结构的情况,并加以分析,选择比较合适的HTML标签,而不是采用非标准的Table布局或者充斥着大量div和class的布局方式。事实上,现在存在着一种误区,就是凡事采用了DIV+CSS的方式进行页面编程的就是Web标准的...

2015-08-25 09:42:35 948

原创 Ubuntu下安装Passenger 用于部署 Rails 应用

安装 Passenger 用于部署 Rails 应用查看是否安装了gem $ gem -v $ gem install passenger$ passenger -vPhusion Passenger version 4.0.10           由于 Passenger 需要重新编译 Nginx,如果你之前有安装 Nginx 需要卸载掉!nginx -v...

2015-08-18 17:35:09 214

原创 web前端 响应式网页设计

响应式网页设计        响应式Web设计(Responsive Web design)的理念是:页面的设计与开发应当根据用户行为以及设备环境(系统平台、屏幕尺寸、屏幕定向等)进行相应的响应和调整。三步实现响应式网页 第一步:Meta标签       大多数移动浏览器将HTML页面放大为宽的视图(viewport)以符合屏幕分辨率。你可以使用视图的meta标签来进行重置。...

2015-08-10 22:19:51 1065

原创 html基础知识

        基于Web前端技术是有HTML静态语言向现在的JaveScript、Ajax、ExtJs、JQuery等框架的发展。鉴于自己对处理Web前端开发过程中由于对HTML没有深入的了解而带来的一些欠缺。因此发点时间来学习回顾下HTML语言。什么是HTML?         HTML是用来描述网页的一种语言。同时它是超文本标记语言(Hyper Text Markup Langu...

2015-08-04 10:07:18 81

原创 JQuery中$.ajax()方法参数详解

 JQuery中$.ajax()方法参数详解url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址。type: 要求为String类型的参数,请求方式(post或get)默认为get。注意其他http请求方法,例如put和      delete也可以使用,但仅部分浏览器支持。timeout: 要求为Number类型的参数,设置请求超时时间(毫秒)。...

2015-07-28 09:18:07 51

原创 ajax

一 Ajax究竟是什么? Ajax让web开发者创建交互式的网站,功能比缓慢的、静态的网站更像桌面应用。 Gmail 和 Google Maps 是两种最常见的Ajax应用范例。多种方法让Ajax可以在浏览器中直接放置交互,取代浏览器不得不频繁联系web服务器获取信息的状况。 当访问一个Ajax站点,浏览器象通常那样装载HTML页面。然后,Ajax使用 JavaScript 进行交互。当一个站点...

2015-07-21 09:34:43 57

原创 web前端基础 什么是对象

         英文 Object ,计算机业界现在已经习惯翻译为“对象”;口语化一些,中文的意思就是“事物”。        “事物”这个词有点抽象,你当然可以具体到人,或是具体到交通工具。人可以再具体一些,学生?工人?如果是学生,叫什么名字?         每个事物都有一些特点,人有身高,体重,在程序中我们称之为属性;还可以有一些行为,人要吃饭,睡觉,在程序中我们称之为方法...

2015-07-15 10:42:30 941

原创 Rails中validates及各种用法

Rails中validates及各种用法       首先是不为空validates :name,presence:{message:'blank is not allowed'}        唯一性:validates :name,uniqueness:{message:'already exist!',case_sensitive: false}#case_sensitive区...

2015-07-07 17:53:12 205

原创 ruby的入门基础

Ruby中的关键字如下:        模块定义:module        类定义: class         方法定义:def,undef       检查类型:defined?         条件语句:if,then,else,elsif,case,when,unless       循环语句:for,in,while,until,next,break,do,r...

2015-06-29 22:52:57 90

原创 ubuntu安装Ruby on rails

                          安装Ruby on rails       对于新入门的开发者而言,如何正确的在ubuntu下安装Ruby on Rails 的运行环境可能会是一个问题,本页面将详细介绍如何解决这一问题: 步骤0   安装系统需要的包,在lnux终端输入下面命令      $ sudo apt-get install -y build-e...

2015-06-29 21:36:09 86

原创 css 属性归纳

CSS 背景属性(Background)属性描述CSSbackground在一个声明中设置所有的背景属性。1background-attachment设置背景图像是否固定或者随着页面的其余部分滚动。1background-color设置元素的背景颜色。1background-image设置元素的背景图像。1ba...

2015-05-18 23:55:41 168

原创 web前端 标签语义对照表

                                      标签语义对照表 标签名英文全拼中文翻译divdivision分隔spanspan范围olordered list排序列表ul...

2015-05-18 23:33:21 172

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除