主机合租每年最低50元/博客新手特惠套餐: 每年98元拥有你的独立博客
May 30th, 2008 by paran

Typogridphy: 适合网格布局的CSS框架

Typogridphy是一个CSS框架,用来帮助网页设计师和前端开发者能够快速编码实现漂亮的网格布局。

Typogridphy是基于帕兰之前介绍的一个挺受欢迎的960网格系统 ,它可以让你快速创建出各种各样的网格布局,并且非常轻松和简单。这个框架的CSS充分符合语义验度,严格的XHTML等标准 。

May 30th, 2008 by paran

CSS画廊装饰技巧

喜欢Wordpress或设计的朋友应该对Nick La都比较熟悉,在帕兰映像的多篇文章中也提到过他的精美设计和分享给大家的技巧.这不,Nick La最新又为我们带来了一个CSS画廊装饰技巧,就是如何利用CSS Hacks给画廊中的图片添加上各种装饰效果,比如相框,贴纸,圆角,大头贴效果等等.并且兼容各大主流浏览器.有兴趣的朋友可以查看他的这个教程,仔细的学习一下.

May 19th, 2008 by paran

PSD2CSS: 快速转换PSD文档为CSS网页

PSD2CSS可以让你在线转换你那漂亮的Photoshop设计为严格兼容CSS的网页。包括CSS缩写,层叠样式表,简单, 快速的在技术上是最好的方法来建立你的网页。
要使用PSD2CSS, 只需要上传你的PSD设计,然后就可以下载到得你的CSS网页, 包含HTML文件和图像。它就是这么简单。

April 29th, 2008 by paran

17款加速效率的CSS工具

作为一个网站设计/开发人员,你必须不断寻找方法来减少设计/开发过程中所花费的时间。这对于提高你的工作效率并最大化你的利润是非常重要的。下面介绍的按功能分类的CSS工具可以有效地节省你设计网站的时间。
表格类
1、CSS Form Code Maker - 很方便地生成“五颜六色的BOX布局”的表格。
2、JotForm - JotForm是一个“所见即所得”的表格生成器。
字体类

April 23rd, 2008 by paran

50多个极富创意的CSS演示和教程

CSS可以让网页设计中实现很多丰富和独特的技术. 今天,我们就围绕着CSS技术展示全面的探讨, 为你找寻一些最具创造性的CSS技术和使用技巧. 绝对值得喜欢网页设计的你一看. 此文由帕兰翻译自Noupe的Using CSS to Do Anything: 50+ Creative Examples and Tutorials.
如果你喜欢CSS, 那你可能对帕兰之前发表的一些文章也会感兴趣 :

101个CSS技术高级应用教程(上)
101个CSS技术高级应用教程(下)
50种强大的CSS技术
53种网页设计师必备的高级CSS技巧

样式化列表
神奇的<li>标签- 使用少许的CSS, <li>标签成为CSS设计中最常用最有效最多才多艺的一个元素, 此文将向你介绍如何发挥 <li>标签的最大作用.

Better Ordered Lists (Using Simple PHP and CSS)- 这是一个示例, 教像如何使用PHP和CSS创建一个传说中的有序文章列表, 还且这个编序号码还是首字下沉的效果.

Style Your Ordered List- 这是一个快捷教程, 教你如何使用有序列表<ol>和段落标记<p>元素来创建一个漂亮的编号列表.

Live DemoView it Here
Download zip file

List Based Calendar-通过<li>元素实现的日历.

Live DemoView it Here

表格和表单元素
Datasheet-style form using HTML and CSS- 使用HTML,CSS 和JavaScript 创建一个数据库风格的档案记录,

April 22nd, 2008 by paran

CleanCSS: CSS精简压缩工具

CleanCSS是一个免费的CSS精简压缩工具,通过这个在线工具,可以将你的CSS文件压缩、优化成更精简,这将大大提高你的网站的载入速度。进入CleanCSS后, 你可以输入要压缩的CSS代码或是该CSS文件的所在URL地址, 然后选择代码布局和相应的精简压缩选项, 最后点击生成即可.
当然, 这里所说的压缩并不是像.zip文件那样的压缩, CSS文件的压缩呢, 其实就是指通过对CSS代码中重复的地方进行合并来达到减少代码的效果. 不过, 对于那些需要经常修改到CSS代码的朋友来说, 并不推荐使用这个工具. via chada

April 20th, 2008 by paran

30多个CSS和JS下拉菜单资源

导航菜单是网站设计中最重要的因素之一。网络开发人员可以使用CSS创建方便用户的横向或纵向导航菜单, 而JavaScript则使人们有可能创造更多的互动,更多的响应和更灵活的导航到任何网站。Noupe在这篇文章里面提出了25个以上(横向和纵向)多层次的下拉菜单,包括使用了JavaScript和CSS ,你可以将这些示例和教程用你的未来网站设计计划。帕兰照常为你翻译, 你也可以查看帕兰映像之前发表的一些关于菜单应用的文章:

IzzyMenu: 在线创建DHTML/CSS菜单
9款CSS菜单生成器/含在线CSS导航菜单生成和CSS菜单生成软件
50多套CSS导航菜单免费资源
ADxMenu:基于Javascript和CSS的下拉菜单
Flickr的横向下拉菜单效果实现教程
Likno AllWebMenus™:强大的导航菜单生成软件
创建Wordpress主题的悬浮菜单
60多个网页导航菜单设计实例欣赏

横向和纵向的下拉菜单
1) Drop Down Tabs (5 styles)- Drop Down Tabs是一个横向的CSS 选项卡菜单, 每个选项卡都支持二级下拉菜单.

2) Professional Dropdown

3) Multi-level effect menu- 这是一个高度可配置的 javascript/css下拉菜单, 可以让你轻松生成多级层联的横向或纵向下拉菜单.

30多个CSS和JS下拉菜单资源/帕兰映像
4) FastFind Menu- 一个基于 jQuery的菜单, AJAX的响应效果, 这个菜单可以 进行拖拽操作.

5) jQuery SuckerFish

6) Fancy Sliding Tab Menu using script.aculo.us

7) List Based Menu with Images- 使用<UL><LI>元素生成的菜单, 它使用简单, [...]

April 15th, 2008 by paran

cushyCMS: 基于Web 通过CSS 控制网站

cushyCMS一套非常特别的CMS内容管理系统, 它基于Web, 可以让你控制管理你的网站设计. 如何用? 在CushyCMS注册一个帐号, 登录, 添加你的网站, 添加的时候需要输入FTP服务器及用户名和密码以及目录, 然后你就可以在线编辑你的网站并实时的同步更新FTP.

March 16th, 2008 by paran

IzzyMenu: 在线创建DHTML/CSS菜单

IzzyMenu.com 让你可以为你的网页创建专业的菜单. 你可以在建创建DHTML下拉菜单,并且不需要编写任何代码.最重要的是,它是完全免费的。

该工具内置了十多种菜单风格. 你可以自定义选择横向菜单或垂直菜单,字体,背景颜色,内外补丁值,链接和悬浮链接的样式等。同时,还可以使用图片做为菜单元素。且提供所见即所得的实时预览,生成后的代码直接复制粘贴到你的网页即可。

March 14th, 2008 by paran

9款CSS菜单生成器/含在线CSS导航菜单生成和CSS菜单生成软件

1.来自Webmaster-toolkit的CSS菜单生成器。有3种菜单风格可以选择,可以设置菜单文本的颜色,悬浮颜色,背景颜色和背景悬浮颜色,文本字体和大小以及文本的名字和链接等。

2. CSS Menus Maker - 提供20多种非常精致和漂亮的CSS菜单效果供你选择,包括CSS横向菜单,CSS垂直菜单和CSS下拉菜单。你只需要选择一下菜单,然后输入菜单的Tab数目以及相关的文本和链接即可生成HTML,CSS和图片,下载即可,同时,你可以下载网站提供的CSS菜单生成软件,里面包含更加丰富的CSS菜单效果,并且完全免费。

3. CSS导航菜单生成软件
这是一个需要下载的CSS导航生成软件,它的特点是所见即所得的菜单生成,含有字体,颜色,宽度,高度等多项设置。

4. 免费的CSS menu generator软件
包含多种CSS菜单效果,所见即所得的菜单编辑生成。Windows资源管理器式的操作面板,非常方便的生成各种炫酷的CSS菜单。

5. Tab Generatror
在线生成非常有质感和Web2.0风格的Tab选项卡菜单。

6.Infinite Menus
一个非常不错的纯CSS菜单生成器。

7. Likno AllWebMenus™:强大的导航菜单生成软件
8.css builder 在线的CSS风格创建工具,设置选项比较丰富。
9. navbar gengerator 在线的导航工具栏生成工具。

March 13th, 2008 by paran

50多套CSS导航菜单免费资源

#1  23个免费的CSS横向导航菜单和14个免费的CSS垂直导航菜单
via exploding-boy.com
11个使用滑动门技术创建的CSS导航菜单 ,来自exploding-boy,你可以 打包下载这套菜单 或是查看查看菜单预览.

12个CSS导航菜单  预览 和 打包下载

14个免费的CSS垂直导航菜单 预览和打包下载
#2 9种不同风格的CSS垂直导航菜单免费下载
打包下载或是预览

#3 专门收集CSS导航菜单展示的站点或文章
CSS showcase - 收集有上百个CSS导航菜单实例,不过这些CSS导航菜单都是来自其它网站或博客,并不提供教程或是代码下载。
Collection of Web 2.0 Navigation Menus - 收集了50个左右的CSS导航菜单展示和欣赏,同样不提供教程或代码下载。
50多个时尚的CSS导航菜单欣赏 - 来自Smashing magazine的收集展示,也只有展示和欣赏。
CSSpaly- 著名的CSS学习和资源网站,里面提供的CSS菜单会让你看的眼花。
上面提到的这些只有展示没有教程和代码下载的菜单,其实你可以根原作者进行讨教,或是如果你有一定的CSS基础,那直接查看源代码就可以很容易的找出来。
 13style- 收集有13种风格的CSS菜单,每种菜单都有代码使用教程和实例演示。
#4  CSS菜单教程和实例演示
 4级深度的CSS菜单 :教你如何创建4级深度的CSS菜单。
CSS横向二级菜单演示,有CSS代码下载。

Absolute Lists: Alternatives to Divs,一个教程,教你如何使用完全的列表元素来实现多级菜单,而不需要任何的DIV元素。
一个纵向CSS导航菜单,悬浮效果还不错。

只用一张背景图实现的漂亮CSS效果,也就是利用帕兰之前介绍过的CSS sprites(CSS 妖精)来实现漂亮的CSS效果,并且这样可保证在悬浮时,背景图片不会出现没有及时加载的情况。

一个多级横向层联菜单的实现教程和演示。
 创建一个适用于网站指南或导图之类的CSS菜单

#5 下面是帕兰之前介绍过的一些CSS导航菜单实现技术 
Flickr的横向下拉菜单效果实现教程
13个效果超酷的Javascript网页导航菜单
7个强大超酷的CSS导航菜单
多个Mac风格的鱼眼菜单(Dock Menu)免费下载和教程
CSS Dock Menu:让你的Itheme主题更漂亮
又一个Mac OS X的Dock Menu鱼眼菜单
60多个网页导航菜单设计实例欣赏
ADxMenu:基于Javascript和CSS的下拉菜单
5个web2.0风格的CSS菜单创建教程