使用SVG实现gradient背景渐变

2011年09月23日 by 张 鑫旭 阅读 116792 次, 今日 6 次

现在现代浏览器都对CSS3的渐变支持良好,加上IE的渐变滤镜,可以在不使用图片的情况下实现各个浏览器的两色渐变效果。这里,再简单介绍下如何使用svg实现元素背景的垂直渐变,水平渐变,斜向渐变,或是径向渐变,以及更加复杂的多层渐变。

耳熟能详的唠叨:本文提供demo页面,丰富的截图以及必要的源代码展示。希望本文的内容可以对您的学习有所帮助。

阅读全文…

HTML5 localStorage本地存储实际应用举例

2011年09月22日 by 张 鑫旭 阅读 334980 次, 今日 5 次

HTML5虽未来到其鼎盛时期,但这并不妨碍我们在实际项目中渐进使用HTML5的一些特性。就我所做的项目而言,应用的HTML5相关特性有:data-自定义属性、placeholder、以及email类型input文本框。上周新上线的会员中心,自己又应用了HTML5相关内容——HTML5 localStorage本地存储,这里简单分享下。

一如既往,本文提供demo页面,提供必要的截图和源代码展示,还有对比实例,希望能触动一下大家的小小神经。

阅读全文…

小卖弄:纯CSS实现图片滚动播放效果

2011年09月21日 by 张 鑫旭 阅读 130439 次, 今日 7 次

网站的首页经常或有广告位图片滚动展示的效果,主流网站上都是使用Javascript实现的。实际上,在CSS3的世界里,我们可以完全摒弃Javascript实现类似的效果。而本文的内容就是展示于简单介绍如果使用CSS3实现图片滚动动画展示效果。提供demo页面,必要截图和源代码展示,希望能对您的学习有所帮助。

阅读全文…

应运而生的web页面响应布局

2011年09月19日 by 张 鑫旭 阅读 124239 次, 今日 3 次

技术的发展往往导致新事物的产生。关于web页面布局,我们应该听过固定布局(fixed layout)、流体布局(fluid layout),那响应布局(responsive layout)是哪个鸟蛋呢?

本文就将深入浅出地介绍响应布局。提供目前现有网站的实例展示,提供自制demo实例展示。配备必要的截图,提供详尽的源代码,细致的分析阐述。相信本文的内容会对您的学习有所帮助的。

阅读全文…

基于HTML5的可预览多图片Ajax上传

2011年09月15日 by 张 鑫旭 阅读 670669 次, 今日 37 次

在XHTML的时代,我们使用HTML file控件上传图片一次只能上传一张。要一次上传多图,做法是借助于flash。或者使用隐藏的iframe框架页面模拟ajax上传,一次一张,连续多次。然而都有缺陷。HTML5是个好东东,其中之一就是支持多图片上传,而且支持ajax上传,而且支持上传之前图片的预览,而且支持图片拖拽上传,纯粹利用file控件实现,简单方便迅速,想不让人称赞都难啊!

本文就是详细地介绍基于HTML5的可预览多图片Ajax上传的一些内容。有丰富的截图示意和源代码展示,以及必要的API参数说明。希望本文的内容能够对您的学习有所帮助。

阅读全文…

CSSOM视图模式(CSSOM View Module)相关整理

2011年09月9日 by 张 鑫旭 阅读 203552 次, 今日 12 次


就在8月份,也就是上次gf大姨妈来的时候,W3C出炉了CSSOM视图模块草案。CSSOM视图模块(CSSOM View Module)定义了一些 API,Web 开发人员使用这些 API 可以进行检查,也可以以编程方式更改文档及其内容的视觉属性,包括布局框定位、视区宽度和元素滚动。

本文的内容就是将CSSOM视图模块相关的一些属性,方法等一个一个整理出来,包括兼容性,使用等等。每个API基本上都提供demo页面测试,使用的源代码展示等等。内容较多,请耐心阅读。相信本文的内容会对您的学习有所帮助的。

阅读全文…

CSS项目Minimum Page简单介绍

2011年09月1日 by 张 鑫旭 阅读 83856 次, 今日 6 次

Minimum Page项目的终极产物形式就是个CSS文件。我们都知道CSS reset重置的终产物也是个CSS文件,只是里面的样式无论在各个浏览器中是否有差异都是置为0,或normal之类。
而这里Minimum Page项目:
1. base.css文件只针对各个浏览器下有差异的元素进行样式定义(例如……

阅读全文…

CSS3 Media Queries的些野史外传

2011年08月23日 by 张 鑫旭 阅读 54475 次, 今日 4 次

本文是去年这个时候流产的草稿又起死回生的一篇文章。当初本来想详细讲述Media Queries的前前后后,祖宗八代,后发现被人捷足先得,不得已,流产了。今天在1周年之际,重拾此文,讲下CSS3 Media Queries的些野史外传。有demo,有源代码展示,总之,希望本文的起死回生之作能够对您的学习有所帮助。

阅读全文…

小卖弄:字符上下半截的高亮显示

2011年08月17日 by 张 鑫旭 阅读 48145 次, 今日 5 次

近日闲适,就随便折腾点东西。本文的内容就比较蛋疼,使用CSS让字符分别上下半截高亮显示。模拟淘宝网排序处的双向排序箭头效果。提供demo页面,必要的截图和源代码展示。总之,希望本文的内容能够对您的学习有所帮助。

阅读全文…

小tip:巧用CSS3属性作为CSS hack

2011年08月15日 by 张 鑫旭 阅读 57468 次, 今日 4 次

本文是个短篇,一点小技术的展示。如何妙用CSS3属性作为CSS hack来实现一些兼容性的页面效果,同时,又能兼顾一些现代浏览器。提供demo页面,必要截图以及源代码展示。总之,希望本文的内容能够对您的学习有所帮助。

阅读全文…