8个CSS图表数据制作实例

有很多方法可以用来呈现数字, 我们最常用的就是制作一张静态图片. 但你也可以考虑CSS。使用CSS样式化元素来实现数据图表化. 可以使数据的控制更具灵活性。

下面. 你将看到8个CSS技巧. 教你如何使用CSS来制作漂亮、灵活的图表。

1. CSS线条图表数据

这个实例包含了三种图形数据的实现方法。上面的Basic Bar Graph实例中使用了一个<div>包含图表. 一个<strong>元素作为柱形的block. 然后再使用百分比来控制柱形的宽度. 这种方法中一个优点就是使用了<strong>元素而不是段落<p>元素。另外两个例子则是使用了定义列表dl和无序列表ul实现。

查看演示1

2. 符合标准的可访问的可视化CSS数据图表

作者Wilson Miner研究数据图表的Web accessible可访问性概念和标准兼容性技术. 涉及优势、限制或是说两者取长补短的折中用法。这里有三个使用无序列表ul基本结构实现的实例。

查看演示1 查看演示2 查看演示3

3. CSS竖行图表

这个实例展示的是一个和“CSS线条图表数据”类似的应用. 使用无序列表ul实现竖行图表效果。

查看演示

4. 使用百分比和背景图片创建的CSS图表

在这个例子中. 你可以参考使用预先做好的背景图片完成适当的数据描述。但缺陷就是这个预先设计好的背景图片也会局限住其使用范围. 如果要实现更多的不同效果. 就要增加CSS和html文件大小. 同时. 你的HTTP连接数也就会增加。

查看演示

5. 纯碎的CSS数据图表

这个例子使用定义列表dl标记. 然后在<dd>定义列表中用<span>元素来控制柱形区域的高度. 用<em>元素来显示图表遮罩区域的数值表示和在条形中间的绝对位置。

查看演示

6. CSS实现小块错综区域图表

至今还没遇到过类似的应用. 但通过这个实例一定可以有效地提高你的CSS应用能力。

查看演示

7. 定义列表dl实现的CSS线条图表

这个技巧用两个横向线条图表实例来表述dl实现方法. 每一个例子都是使用被赋予class的dl元素来控制图表的宽度百分比。

查看演示

8. 具备可访问行的CSS线条图表

该实例使用table来控制整天图表的结构. 然后使用CSS样式及背景图片来将图表延伸至适当的宽度。

查看演示

英文原文：8 CSS Techniques for Charting Data
中文译文: 8个CSS柱状图表

来源于 8个CSS图表数据制作实例 | 帕兰映像

Blogger的5个新增功能简介

最近Blogger在国内又可以自由访问了, Techno Life 总结了Blogger的5个新功能，Chada为我们进行了翻译. 如果你是一个Blogger用户, 快看看Blogger又给你带来了些什么惊喜.

不过目前5个新功能还没有正式加入到用户使用中, 必须通过Blogger in Draft才能查看，这次更新，不但添加了几个非常重要的功能，还对已有的一些功能做出了改进。这些功能在不久的将来就会在Blogger正式推出。

1. 星级评分：在每篇日志添加一个星级评分，可以让读者对当前日志进行评级。

2. 页内评论：现在的Blogger可以像wordpress一样支持在日志当前页面直接评论了，而不再是在新弹出的页面中。我有点讨厌旧的评论方式，就像我讨厌弹窗广告一样。发表评论支持Google通用账户，也可以使用OpenID。

3. 导入/导出和备份博客：备份所有的日志和评论。导出XML文件以便转移到另一个博客，反之，导入XML文件导入另个博客的日志和评论。

4. 网站管理员工具整合：现在可以方便的查看Google的蜘蛛什么时候来过收入页面，那些关键字给你带来了流量。

除此之外，Blogger的新功能测试区的页面也一改之前的经典橙色Logo，颜色变成了天蓝色。控制面板的样式也有一些较大的变化，由原来的两栏式变成了现在的单栏式。

5. 新的日志编辑器：在新的日志编辑器中，支持拖曳图像的位置，html的处理也更加完善。使用Blogger的朋友现在可以一次性上传多张照片，然后插入到日志中。

其它的Blogger功能改进包括(via)：

• 改进与Google Gadget的整合，能够更好的修改Gadget的属性；
• Blogger Dashboard的再次优化，改变“show all blogs”的显示方式；
• Subscribe页面元素被发布到WWW；
• 可以把Blogger in Draft控制面板设置为Blogger默认；
• 在控制面板显示Blogger in Draft的官方blog。

来源于 Blogger的5个新增功能简介 | 帕兰映像

Amazon提供MP3剪辑Widget

Amazon最新提供了一个MP3剪辑的Widget- Amazon MP3 Clips Widget, 你可以把Widget放置到你的博客网站。Widget内的MP3音乐剪辑可以通过搜索亚马逊的DRM免费MP3音乐进行添加组织,  你可以展示最流行的MP3音乐，或是根据你喜欢的音乐流派进行展示。如果这样还不够，这个Widget可以显示你在Amazon购买的MP3音乐.

来源于 Amazon提供MP3剪辑Widget | 帕兰映像

15个购物比价网

网上购物已经很普及了，大家之所以上网上购物，就图个便捷和省钱，同样的商品，争取以最低的价格购买到手，购物比价网应运而生。

1. Google购物搜索

谷歌发布的购物搜索引擎，其搜索内容包括目前国内主流的B2c和C2C网站。用户可以对搜索结果中的多个商户价格进行比较。

2. 聪明点

聪明点比较购物网，致力于提供方便、详细地比较相似商品的价格,规格参数，产品信息达到100多万，包括电脑硬件、数码产品、手机、汽车用品、办公用品、鲜花园艺、化妆品等。聪明点帮您作出最聪明的网上购物选择。

3.YY购物搜索

丫丫购物搜索, 产品信息包括数码相机,IT,手机,婴儿用品,护肤香水,图书,音像,礼品等。

4. 有道购物搜索

有道购物搜索收录了近300家网上商城中超过一千万的商品信息，覆盖图书、数码、美容、母婴、服饰等9大类别，提供搜索商品、比较价格、查看商家信誉等功能，让您更方便地买到放心实惠的商品。

5. 比价网

比价网提供最新最权威的IT产品经销商报价比较，包括手机数码、DIY配件、笔记本整机、网络设备、办公外设、数字家庭等IT产品最新报价，为您购买IT产品提供最有价值的参考。最新最权威的IT产品报价尽在比价网!

6. 易比网

提供产品比较和排名。

7. 大拿网

大拿网中文比较购物搜索引擎-旨在打造国内领先的网上购物品牌。为您提供最新价格,导购,行情,资讯等信息。大拿网是您网上购物的最佳助手。我们的产品包括：手机,数码,电脑,图书,音像,化妆品,家电,两性用品,办公用品等等数百种分类300多万的产品收录量。

8. 特价王

特价王致力于提供方便快捷的比较购物服务以及成为中国网上购物回馈之王.在特价王上你还有机会享受高达20%的购物返点.我们的产品包括通讯、IT数码、家电、图书音像、办公用品等.通过特价王的比较购物以及购物之后的返点回馈使你花的每一分钱都很值得。

9. 易价网

国内领先的比较购物网站！查询正品行货商品的最低特价格,同时是国内新兴的购物返点网站，去购物拿返点，优惠多多.

更多比价购物网站

• 10. 好图书
• 11. 顶9网
• 12. 易购网
• 13.  购龙网
• 14. 易买通
• 15. 一兜比较购物网

via web20share

来源于 15个购物比价网 | 帕兰映像

Photoshop雪花形状笔刷资源下载收集

很多地方都下雪了吧。我之前见到很多博友都被几片雪花刺激的有点不正常了。但还是有的朋友，无缘见到漂亮的雪花。

尽管我自己讨厌冬天，冷的让人烦。但不能不能承认雪花是很漂亮的。

下面收集了一些photoshop的雪花笔刷，还没看见雪的朋友可以拿去设计几幅图片，意淫一下。

雪花笔刷下载地址
绒丝雪花笔刷下载地址
下载包里面含20个雪花笔刷

Photoshop雪花笔刷下载地址
这个笔刷下刷集里面有20个雪花笔刷

Photoshop雪花笔刷下载

Photoshop雪花笔刷下载
包含13个雪花形状的photoshop笔刷

Photoshop雪花笔刷下载
这个下载包里面包括了下雪，雪花笔刷, 结冰的树，水晶的冰条等等笔刷。


Photoshop笔刷下载地址
含22个Photosho雪花笔刷.

Photoshp笔刷下载

Photoshop笔刷下载


Photoshop雪花笔刷下载地址
含29个Photoshop雪花笔刷


Photoshop雪花笔刷下载

含三种很特别的雪花笔刷

Photoshop雪花笔刷
包含8个Photoshop雪花笔刷

Photoshop雪花笔刷


Photoshop雪花笔刷
含50个Photoshop雪花笔刷.

Photoshop雪花笔刷
含50个photoshop雪花笔刷

Photoshop雪花笔刷
含14个Photoshop雪花笔刷

Photoshop雪花笔刷下载地址

Photoshop雪花笔刷下载地址
含6个Photoshop雪花下载包

来源于 Photoshop雪花形状笔刷资源下载收集 | 帕兰映像

PhotoFunia – 在线生成多种有趣的图像特效

利用网络上成千上万的在线图像工具, 不会PS你也可以搞出极富视觉效果的各种图像特效. 之前介绍过一个提供多种图像特效的网站 -Dumpr. 现在要介绍的PhotoFunia跟Dumpr也没有什么区别, 只是所提供的图片特效库不一样而已, 大家多了一个选择.

同样, PhotoFunia所提供的图片特效也主要是一些偏有趣和生活化的图像特效, 只需要选择一个你喜欢的特效, 上传你的图片, 生成即可.

来源于 PhotoFunia – 在线生成多种有趣的图像特效 | 帕兰映像

10+ Facebook 应用程序和相关文章资源

Facebook在前几天推出了中文版, 据我局部观察, 似乎未达到很好的效果, 很多人更愿意使用校内. 毕竟SNS某种程序上和IM一样, 用户是否使用取决于在上前是否有朋友, 尽管论强大, 校内不能和Facebook同级而论. OK, 昨天总结了70多个Twitter应用程序和工具, 今天就来看看本博之前介绍过的一些Facebook应用程序和Facebook之前发布的一些功能介绍.

1.uFacebook: 控制BT下载的Facebook应用程序

uFacebook 是一款Facebook的应用程序, 它可以通过Facebook的API控制实现大多数种子, 实现大多数BT下载的功能。

2.如何嵌入Facebook聊天到Firefox侧边栏
Facebook之前推出了Facebook chat 即时聊天功能, 本文会教你如何嵌入Facebook聊天到firefox侧边栏. 如果你既是一个Facebook迷, 又是一个Firefox迷, 那就得好好看了.

3.Blog it: 在Facebook同步更新博客日志
Blog it是 由Six Apart公司推出的一个Facebook应用程序, 可以让你在Facebook上面直接更新日志到其它博客平台或内容社区, 目前支持的第三方平台有TypePad, Vox, Movable Type, LiveJournal, Blogger, Tumblr, wordpress.com博客和wordpress.org, 或者微博客twitter和Pownce.

4.Babuki: Facebook的桌面即时通讯工具
Babuki 是一款基于AIR的桌面客户端即时通讯帐户聚合工具，它可以让你聚合使用AOL，MSN，Yahoo Message, Gtalk等等IM。但其主要的卖点还是能够聚合Facebook客户端的使用，通过Babuki，你可以与Facebook的好友实时聊天以及查看接受 最新的信息。

5.Facebook的无偿献血应用程序
Takes All Types (TAT)是一个新的Facebook应用程序，由一个非赢利组织提供。你可以安装在你的Facebook上面，做一些无偿献血回报社会的行为，在其中表 明你个人所在的位置和你的血型等信息，当血液短缺的时候，他们会通过你的电子邮件、Facebook或是其它信息与你取得联系。

6.派拉蒙电影剪辑将可在Facebook上面分享
Fanrocket正计划开展一个新的Facebook应用程序，名为voozoo。这个应用将允许Facebook用户从现有的派拉蒙目录中发送自己喜爱的电影剪辑给好友。这些剪辑的时长范围是几秒钟到几分钟的长度。

7.2款Facebook风格的透明圆角边框模型盒特效(Modal Box)脚本

8.OutSync:同步更新你的Facebook好友信息到Outlook
Outsync是一项免费的Windows的应用程序, 它可以同步你在Facebook的朋友的照片，并实时更新到Microsoft Outlook 。它允许你有选择的更新，所以你可以在同一时间内把全部联系人或是选择的联系人导入你的Outlook。

9.Digsby:聚合电子邮件/即时通讯/Myspace和Facebook的桌面应用程序(附邀请码)
Digsby是一个即将到来的桌面应用程序，其主要功能是可以聚合你的电子邮件、即时讯息、Facebook和MySpace 等社会网络帐户。你几乎可以使用Digsby登录到所有主要的即时通讯客户端和电子邮件帐户

10.lymabean:基于Flash的类Facebook社会化网络
lymabean包含一个社会化网站所需要的大部分功能，比如近况，朋友，照片，影片等，且大部份功能都可整合到即时通讯（比如拖放照片到即时讯息等） 。 lymabean也有评级，群组以及其它的功能。

11. Facebook过往大事件:

• Facebook 已证实将推出开放源代码平台
• Facebook正式提供Web即时聊天功能
• Facebook推出聚合Feed小功能
• Facebook增加对应用程序邀请的忽视选项
• Facebook的即时通讯应用视频演示
• Facebook推出德语版本
• Facebook展开本土化策略 推出西班牙语版本
• 美国哥伦比亚广播将在3月份提供Facebook应用
• Facebook推出移动平台 沃达丰成为第一个合作伙伴
• Myspace杀手:Fuser将myspace集成到Facebook
• Facebook off

来源于 10+ Facebook 应用程序和相关文章资源 | 帕兰映像

Streem:又一个微博客服务

微博客，或是Life-streaming，我不是能够太清楚的区分这些概念。所以不知道该说这个新上线的Streem是更像Tumblr还是twitter，它能够允许你在线输入提交文字记录、图片、视频、链接等等。那就应该说他更像Tumblr吧。

在这里，你可以给每个用户创造的内容进行评论，还可以通过搜索功能搜索一个用户或者是一个热门关键词来查找相关的内容。其它我并没有发现什么亮点，但既然是微博客，也差不多足够了。Streem是简单而实用的，更重要的是，它现在还没有封。你可以进去试用，并且不需要邀请函:)

来源于 Streem:又一个微博客服务 | 帕兰映像

PDFsharp: 基于ASP.NET的开源PDF库

如果你你的网站是基于ASP.NET架构，而你又需要一个强大的PDF库 ，那现在有一个免费的解决方法。PDFsharp是一个开放源代码的PDF库，它可以让读者在ASP.NET上面轻松地创建PDF文档，支持所有.NET语言。
PDFsharp的特点包括：

•  创建新的PDF文件，可以包含文字，线条，曲线图，图像等。
• 修改，合并，分割现有的PDF文件或页面，从现有的PDF格式转换成新的PDF文件。

来源于 PDFsharp: 基于ASP.NET的开源PDF库 | 帕兰映像

帕兰映像开放注册 支持头像设置

开放注册。同时，非注册用户禁止留言。

有兴趣的朋友可以点击注册。

留言头像 

简单介绍一下。注册后可在”Your Profile”里设置你的用户名、网址、电子邮件、个人简介等基本信息。同时，重要的的是在底部，可以上传一张图片做为头像，上传后将生成150*150的大图和64*64的缩略图头像。

图1

图2

图3

这张头像将显示为你的留言头像。如果不设置，将用一张默认的图片显示，也就是下图中的第三个头像。

提交文章

同时，如果你有兴趣提交文章到帕兰映像，在每篇文章下面会显示下面格式的作者信息。(注：你提交的文章将会在管理员审核之中才会被发表显示出来)

欢迎大家踊跃注册！稍后会做一些细节的更改，比如登录框之类的。

来源于 帕兰映像开放注册 支持头像设置 | 帕兰映像

10+WordPress投票评级插件

投票, 评级, 能让你的wordpress博客显得更加社会化, 更加重视用户参与. Voting, 投票. Rating, 评级. 两者有区别, 但有时候又很容易混淆. 请看10+Wordpress投票评级插件.

WP-PostRatings – 一个适用于Wordpress文章和页面的ajax评级系统，出自Gamerz之手. 也应该是被使用最广的一个Wordpress评级插件, 支持自定义评级图标等. 请看WP插件达人Gamerz的系列Wordpress插件.

GD Star Rating – 另一个比较强大的Wordpress星级评级系统插件. 支持为文章, 页面甚至是留言添加评级功能, 含多套评级图标供选择. 支持设定评级角色权限等等.

Top Comments – 简单容易的留言评级插件. 在每条留言里面显示当前分数和评级按钮. 同时, 评级分数可以显示在后台控制面板的RSS FEED中. 100+Wordpress留言插件

SezWho – SezWho是一个非常强大包含多种社会化应用功能的wordpress插件. 其中也包含可设定角色权限的评级系统.

Star Rating for Reviews – WordPress星形评级插件. 评级分数保存在数据库, 可以调用出按评级分数, 日期等排列的文章列表.

Post Star Rating -Post Star Rating 是一个简单的Wordpress文章评级插件.

Vote-the-Post – 默认为每篇文章打分为3. 可以定义评级结果是以文本说明显示还是评级分数显示, 以此来适应高流量和低流量的Wordpress博客.

sexyrate – 所谓性感的Wordpress评级系统插件. 单选框式的评级, 评级文本上面可以设置几个美女图片.

RateIt – 这个Wordpress插件可以让你添加一个来自http://www.rateit.org.uk的Widget到你的博客侧边栏.

Vote It Up -添加Digg风格的投票系统到你的Wordpress博客文章. 就是那种顶和踩的东东.

Vote 2 Republish -一个Wordpress MU插件, 添加一个投票框到每篇文章中.

来源于 10+WordPress投票评级插件 | 帕兰映像

Wilogo: 企业Logo创作社区

Wilogo是一个企业Logo创作社区，按照他们自己的介绍，他们的社区拥有2042个多才多艺的设计师，可以为企业提供Logo标志，商业名片和网站的设计。

Wilogo

既然是Logo创作社区，也就是说，为企业和设计师提供一个近距离接解的友好平台。具体我也没怎么研究Wilogo，它对我最大的意义在于可以从该网站展示的Logo中吸取一些灵感。如果你的想法跟我一样，那有空逛逛Wilogo吧。

来源于 Wilogo: 企业Logo创作社区 | 帕兰映像

15款高质量免费WordPress主题

每天我们都能看到许多漂亮的wordpress主题, 其中不乏许多优秀之作。wordpress主题的选择是足够丰富的，但搜索查询自己喜欢的WordPress主题是一件麻烦的事情。本文里面，我们为你收集了近期比较优秀的15个免费WordPress主题。

1. Agregado Lifestream

一个免费且专业的Wordpress主题，由Darren Hoyt 和 Matt Dawson制作. 这个主题的特色是包含了lifestream 和联系表单，并且可以在后台进行选项设置. 还包括自定义存档页面，动画效果的JS下拉菜单等等。

• 主题演示看 这里
• 下载主题从 这里

2. Guzel

这是一个两栏布局的WordPress主题，拥有精致的头部设计，大量使用TAB标签切换来显示最新日志专栏，留言模块等。特色包括集成了Flickr展示，和一些社会化书签比如Digg, Del.icio.us和Stumbleupn等。

• 主题演示看 here
• 下载主题从 here

3. Simple Balance 2.0

Simple Balance 2.0 – 一个免费，简洁的WordPress 主题，却像付费主题一样拥有足够多的选项设置。

• 主题演示点 这里
• 下载主题从 这里

4. Infinity

来自Yichi的三栏主题，之前做过介绍，特色包括缩略图日志填充面，集成Flickr, Delicious 和twitter ，当然，最大的亮点还是精美独特的设计风格.

• 免费且没有任何限制的WordPress主题
• 下载主题从 这里

5. Outdoorsy

如果你在寻找一个独特的主题，那这个使用了大量平面图片设计的WordPress可能会是你想的。

• 主题演示 here
• 下载主题 here

6. SCRUFFY

这是一个基于960网格框架的主题，清新，简洁，大方。后台可设置选项也比较丰富。

• 主题演示 here
• 下载主题 here

7. SubtlyMade

一个特别的两栏WordPress主题。

• 主题演示 here
• 下载主题 here

8. WP Coda

仿Coda 网站的一个WordPress主题，大量JS特效的运用，让这个主题非常之酷。

• 免费而且没有任何限制的主题
• 下载主题 here

9. True Elegance

True Elegance 是一个三栏WordPress主题，完全支持侧边栏Widget.

• 主题演示 here
• 下载主题 here

10. Massivepress

• 主题演示 here
• 下载主题 here

11. Purple Fever

两栏WordPress主题

• 主题演示 here
• 下载主题 here

12. Modicus Remix

基于“Modicus “修改得来的一个主题，“最小限度的设计风格”。

• 免费
• 下载主题 here

13. Crybook

• 主题演示 here
• 下载主题 here

14. WP NewsMag

This is a Hybrid blog/portfolio/photo/magazine style theme. Features includes: Widgeti ready with five custom sidebars, 5 different front page category loops, Slider function for bottombar and featured articles, Three level CSS/JS dropdown menu and Utilization of Custom Fields for neat image display on the front page.

• 主题演示 here
• 下载主题 here

15. Simply Ornate

• 主题演示 here
• 下载主题 here

本文英文原文来自Noupe的15 High Quality Premium-Like Free WordPress Themes，其中好几个主题跟我之前介绍的11款新鲜出炉的WordPress主题差不多。希望你能挑到自己喜欢的主题。

来源于 15款高质量免费WordPress主题 | 帕兰映像