随笔分类 -  前端

客户端技术,包括DHTML、CSS+Div、JQuery、Photoshop等
摘要:一、负边距与浮动布局 1.1、负边距 所谓的负边距就是margin取负值的情况,如margin:-100px,margin:-100%。当一个元素与另一个元素margin取负值时将拉近距离。常见的功能如下: 1.1.1、向上移动 当多个元素同时从标准流中脱离开来时,如果前一个元素的宽度为100%宽度 阅读全文
posted @ 2016-12-06 08:29 张果 阅读(35313) 评论(11) 推荐(65) 编辑
摘要:一、web font web font是应用在web中的一种字体技术,在CSS中使用font-face定义新的字体。先了解操作系统中的字体: a)、安装好操作系统后,会默认安装一些字体,这些字体文件描述了每一个文字的形态,一般中文文件大,英文文件小,因为中文字符数多;在控制面板中可以找到文字文件夹, 阅读全文
posted @ 2016-12-05 08:30 张果 阅读(9268) 评论(0) 推荐(15) 编辑
摘要:一、BFC与IFC 1.1、BFC与IFC概要 BFC(Block Formatting Context)即“块级格式化上下文”, IFC(Inline Formatting Context)即行内格式化上下文。常规流(也称标准流、普通流)是一个文档在被显示时最常见的布局形态。一个框在常规流中必须属 阅读全文
posted @ 2016-12-01 08:30 张果 阅读(10114) 评论(10) 推荐(46) 编辑
摘要:一、盒子模型(Box Model) 盒子模型也有人称为框模型,HTML中的多数元素都会在浏览器中生成一个矩形的区域,每个区域包含四个组成部分,从外向内依次是:外边距(Margin)、边框(Border)、内边距(Padding)和内容(Content),其实盒子模型有两种,分别是 ie 盒子模型和标 阅读全文
posted @ 2016-11-29 08:29 张果 阅读(7207) 评论(10) 推荐(32) 编辑
摘要:一、Canvas canvas是HTML5中新增一个HTML5标签与操作canvas的javascript API,它可以实现在网页中完成动态的2D与3D图像技术。<canvas> 标记和 SVG以及 VML 之间的一个重要的不同是,<canvas> 有一个基于 JavaScript 的绘图 API 阅读全文
posted @ 2016-11-28 08:28 张果 阅读(48599) 评论(8) 推荐(24) 编辑
摘要:一、HTML5概要 1.0、写在最前面 1.0.0、开发工具 全栈:Spring Boot(后台)+前端 后台:IntelliJ IDEA(http://idea.lanyus.com/)、MySQL(Oracle)、MongoDB 前台:Visual Studio Code、HBuilderX(h 阅读全文
posted @ 2016-11-24 09:23 张果 阅读(10567) 评论(2) 推荐(51) 编辑
摘要:web前端开发者最最注的内容是三个:HTML、CSS与JavaScript,他们分别在不同方面发挥自己的作用,HTML实现页面结构,CSS完成页面的表现与风格,JavaScript实现一些客户端的功能与业务。当然内容与用户资源也是不能忽视的。尽量不要跨职责范围使用,有点“SRP单一职责”的意思,如字 阅读全文
posted @ 2016-11-23 15:15 张果 阅读(6763) 评论(19) 推荐(37) 编辑
摘要:B/S结构的软件项目中有时客户端需要实时的获得服务器消息,但默认HTTP协议只支持请求响应模式,这样做可以简化Web服务器,减少服务器的负担,加快响应速度,因为服务器不需要与客户端长时间建立一个通信链接,但不容易直接完成实时的消息推送功能,如聊天室、后台信息提示、实时更新数据等功能,但通过polli 阅读全文
posted @ 2016-11-23 08:33 张果 阅读(5000) 评论(1) 推荐(4) 编辑
摘要:一、HTML5新增属性 1.1、contextmenu contextmenu的作用是指定右键菜单。 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div id="div1" 阅读全文
posted @ 2016-11-22 08:30 张果 阅读(10765) 评论(15) 推荐(44) 编辑
摘要:HTML5问世以后,前端加入了一个重要的功能,便是本地存储,本地存储可分为4类: Local Storage:总的存储量有所限制,并不能提供真正的检索API,数据的生命期比窗口或浏览器的生命期长,数据可被同源的每个窗口或者标签页共享,兼容性很好,使用最多的存储方式。 Session Storage: 阅读全文
posted @ 2016-11-21 08:31 张果 阅读(13509) 评论(4) 推荐(40) 编辑
摘要:最近要做一个企业的OA系统,以前一直使用EasyUI,一切都好,但感觉有点土了,想换成现在流行的Bootstrap为基础的后台UI风格,想满足的条件应该达到如下几个: 1、美观、大方、简洁 2、兼容IE8、不考虑兼容IE6/IE7,因为现在还有很多公司在使用Win7系统,系统内置了IE8 3、能通过 阅读全文
posted @ 2016-08-18 14:39 张果 阅读(87765) 评论(259) 推荐(184) 编辑
摘要:一、规格说明 1、数据库:MySQL、Oracle、SQLServer、DB2、其它数据库 2、服务器:Windows、Linux、Tomcat 3、实现技术:Spring+Spring MVC+MyBatis、Maven、SSH、S2SH 4、前台要求:美观大方,简洁明了。CSS、HTML、Jav 阅读全文
posted @ 2016-07-14 14:04 张果 阅读(3303) 评论(5) 推荐(4) 编辑
摘要:开发中有时候需要从服务器端返回json格式的数据,在后台代码中如果有DateTime类型的数据使用系统自带的工具类序列化后将得到一个很长的数字表示日期数据,如下所示: //设置服务器响应的结果为纯文本格式 context.Response.ContentType = "text/plain"; //学生对象集合 List students = new List { new Student(){Name ="Tom", Bi... 阅读全文
posted @ 2014-02-01 16:46 张果 阅读(149994) 评论(12) 推荐(14) 编辑
摘要:在《弹出层之1:JQuery.Boxy (一)》中讲到了JQuery.Boxy的基本用法,本次讲下手动创建实例,new一个boxy对象是很容易的,传递一些参数对象就能满足不同的需求了。4.1、手动创建实例<scripttype="text/javascript">$(function(){$("#a1").click(function(){//实例化一个Boxy对象varbox1=newBoxy("<h3>这个参数是显示的内容</h3>"//显示内容,{title:"标题",// 阅读全文
posted @ 2011-10-05 09:48 张果 阅读(4015) 评论(1) 推荐(0) 编辑
摘要:Boxy是一个基于JQuery的弹出层插件,它有相对漂亮的外观,功能齐全,支持iframe,支持模式窗口但相对于同样的弹出层插件BlockUI它明显笨重,但使用不那么方便。1、下载并修改插件可以在官网上下载到最新版(http://plugins.jquery.com/files/boxy-0.1.4.zip),到我写这些文字的时候最新版为0.1.4版,下载解压后有1个主要的js文件:jquery.boxy.js;1个css文件;还有4个图片用于构成弹出层的4个圆角。将文件引入系统中,修改boxy.css,将下面的图片路径修改为项目中实际的位置,如果设置不对会引起图片失效,那时就难看了。/*将此 阅读全文
posted @ 2011-10-05 09:27 张果 阅读(19705) 评论(1) 推荐(2) 编辑
摘要:JQuery.BlockUI是众多JQuery插件弹出层中的一个,它小巧(原版16k,压缩后10左右),容易使用, 功能齐全,支持Iframe,支持Modal,可定制性高也意味他默认谦虚的外表。jQuery的BlockUI插件可以让你在使用AJAX时模拟同步行为,锁定浏览器(模式窗口)。当被激活时,它会防止用户活动的页面(或页面的一部分),直到它被禁用。 BlockUI添加元素的DOM,给它的外观和阻止用户交互行为。1、首先引入插件<scriptsrc="jquery.min.js"type="text/javascript"></sc 阅读全文
posted @ 2011-10-01 23:01 张果 阅读(23298) 评论(0) 推荐(3) 编辑
摘要:tipswindow是一个很一般的JQuery弹出层插件,但使用简单,有相对漂亮的外观,代码比较通俗。下面介绍使用方法:1、首先引入该插件相关文件,分别是样式,JQuery库,该插件<linkhref="tipswindown.css"rel="stylesheet"type="text/css"/><scriptsrc="../Contents/JS/jquery-1.5.js"type="text/javascript"></script><scri 阅读全文
posted @ 2011-09-27 21:31 张果 阅读(5883) 评论(0) 推荐(1) 编辑
摘要:我们先来使用firebug查看在前面的示例中JS产生的html错误提示:从图中我们发现错误信息是被放在了一个label标签中,且有一个类样式error,只要为signupform下面的label标签中的error定css样式,应该就可以修改显示结果了,添加的css代码如下: <styletype="text/css">*{font-size:14px;}#signupFormlabel.error{color:Red;font-size:13px;margin-left:5px;padding-left:16px;background:url("err 阅读全文
posted @ 2011-09-05 17:19 张果 阅读(5107) 评论(0) 推荐(0) 编辑
摘要:最终显示在页面上的错误分为两种:第一种是默认错误信息,该信息已经被定义在插件中了,可以手动修改。第二种是通过参数指定的错误信息,如果没有指定则会使用默认的错误信息。将上个示例的js修改如下: 显示源码 <scripttype="text/javascript">$(function(){$("#signupForm").validate(//在上例中新增的部分{rules:{txtPassword1:"required",//密码1必填txtPassword2:{//密码2的描述多于1项使用对象类型required:tru 阅读全文
posted @ 2011-09-05 17:13 张果 阅读(1230) 评论(0) 推荐(0) 编辑
摘要:在前面示例中使用的的方法简单方便,但没有完全将js与页面结构完全分离,也就是说js依赖了class,下面通过validate()方法的参数设置验证规则将js与页面结构完全分离,代码如下: 显示源码 <scripttype="text/javascript">$(function(){$("#signupForm").validate(//在上例中新增的部分{rules:{txtPassword1:"required",//密码1必填txtPassword2:{//密码2的描述多于1项使用对象类型required:true, 阅读全文
posted @ 2011-09-05 17:07 张果 阅读(1306) 评论(0) 推荐(0) 编辑

AmazingCounters.com