奇客资讯、软件硬件、编程系统

March 29th, 2008

permalink 兼容 IE,Firefox 的图片自动缩放 CSS

author: Loveyuki
via: Loveyuki’s BLOG
IE 6 只有在图片完全下载完成后才会自动调整大小
这里使用了 expression,但是利用了一次加载,所以 expression 不会造成内存泄漏
.Image {
max-width:600px;height:auto;cursor:pointer;
border:1px dashed #4E6973;padding: 3px;
zoom:expression( function(elm) {
if (elm.width>560) {
var oldVW = [...]

March 1st, 2008

permalink CSS Hacks & Issues

这篇文章包括了 8 个非常有用的浏览器兼容解决办法
在进行 CSS 设计遇到代码在几个浏览器之间不能正常显示时你就会用到它们…

February 7th, 2008

permalink Web开发设计的五大准则

如果仓促而为,设计一个专题或者网站一定会成为恶梦。Web设计需要遵循一些准则并有计划地去做。
规则 #1 : 先出设计图
这是必须的。不要假设设计图在你的头脑中就开始设计web,必须要放到纸上。可以这样做:
1, 拿尺子、笔和纸,按照具体的尺寸一行一行地画下来;
2, 记得考虑分界线的长度等,这样才能符合CSS的像素;
3, 记下设计的每一个细节免得忘记,如果把所有细节都累积到最后将是巨大的麻烦。
规则 #2 :配色
这是设计的核心部分,只有颜色搭配合适才能使你的网页看起来不错。首先要决定的是主色,也即你在网页中多数使用的颜色;然后选择跟主色调搭配的第二颜色;不要选择超过三种颜色不然你的设计看起来会很乱。如果你想要更多的颜色,可以使用浅色或者深色的阴影来搭配主色调。
1, 浏览十个跟你网页有同样主色调的网页;
2, 给几个人看你的配色方案并取得反馈;
3, 从浏览的网页和反馈你将更好地完善你的颜色搭配。
规则 #3 : 从基本的版块开始构建
定下配色和设计图之后,从最基本的框架开始构建——我的意思是说不添加任何文本。因为在版面中加入文本会使得架构混乱。方法如下:
1, 每一个版块设定边界线,这样能够看到具体的尺寸和位置;
2, 对不同的版块使用不同的颜色,在完成版块后再改成你想要的颜色。
规则 #4 : 理清CSS
不要在你的HTML文件中将styling元素搞得太复杂,不然等到你修改的时候你就不得不到处搜索。所以将所有styling元素归置在一个单独的CSS文档中。
在styling之前理清你的CSS免得太过杂乱导致你多次重复同一件事。CSS支持继承,也即parent block的style可以用于child block.,充分利用这条特性。命名CSS分类名也要易懂易记。比如使用“main_content”而不是“div_1”。
规则 #5 : 制订多重 CSS 文档
我们都知道,使用浏览器可以轻易地看到网页的输出,但使用另一浏览器的时候则可能发现输出不正常。这不是什么稀奇事儿,因为每个浏览器对HTML和CSS的处理方式都不一样。
为避免这种情况,每个浏览器准备一个CSS文档,这样所有浏览器都可以正常浏览。虽然这有一定的难度,但是记着指望一个CSS文档来满足所有浏览器是不可能的。
原文作者:nitinpai
原文链接:5 Rules For A Good Web Design
译者:小猪哥

February 7th, 2008

permalink 20个独具匠心的网页设计

原作者: vandelay 译者: 小猪哥 原文链接

 
当你在创建一个新的网站的时候,一个版面独特的网页总会在不经意间激发你的灵感。不知道这些使用背景图片产生强烈视觉冲击的页面有没有给你带来设计灵感。

2,Digitalmash.com

3,Melissahie.com

4,Evanescenceuk.co.uk

5,Sitotis.hr

6,Mussatto.com.br

7,Basil Gloo

8,Danviv.net

9,CraigEarl.co.uk

10,JeremyCowart.com

11,Huge

12,Interview Magazine

13,The Horizontal Way

14,Swiths.com

15,Davor van Eijk

16,Ribbit.com

17,BootB

18,Vesess

19,Dinulovic.com

20,StoryAbout.net

February 7th, 2008

permalink 一个可以检测网页在不同浏览器中的兼容性的工具

如果你只在乎自己的网站在IE中的表现,请略过此文。
网 页设计中,保证网页在不同的浏览器中的兼容性始终是个头疼的问题。往往不得不再机器上装多个 浏览器,但是浏览器种类太多了,IE6,IE7,Firefox1,firefox2,Opera,Safari,Konqueror。更要命的是这些浏 览器再不同的操作系统上结果也有可能不一样。很难相信谁会在自己的机器上同时安装mac os,windows,linux,仅仅为了检测网页的兼容性。
说了这么多都是要推荐这个优秀的在线检测工具,它可以同时为你检测几十种浏览器,并生成直观图片让你分析。

February 7th, 2008

permalink Firefox, IE7.0, IE6.0等浏览器下,web 标准常见的兼容性问题

有朋友问我FF下,页面如何能让内容自动撑高。
试了一下,在css代码上加上“height:100%; overflow:auto;”就行了
其实这两种定义方法一种是针对IE的,一种是针对FF的,两种都写上最然比较罗嗦,但也算是一种方法

下面是一些常用的IE与FF兼容问题的解决方法,有需要的可以存档备用[...]

February 7th, 2008

permalink CSSArtillery:优秀CSS设计网站分享

原文来自 天涯海阁

CSSArtillery是一个提供优秀CSS设计网站分享和交流的平台。在这里你可以浏览很多优秀的网络设计,给相应的设计评分,发表评论;也可以提交你喜欢的或者你自己的优秀的CSS设计作品。

目前 CSSArtillery上面收集的优秀的CSS设计网站主要分为以下几类:

Associations (3)
Blogging (19)
Business (17)
CMS (30)
Colors (69)
Entertainment (14)

Featured (3)
Institutions (3)
Media (3)
Portal (1)
Web Design (38)
More Categories

如果你喜欢这个收集优秀网站设计的网站,你可以通过RSS Subscribe 和 Twitter了解其最新的情况。
链接:http://www.cssartillery.com/

February 7th, 2008

permalink 网页设计者值得一去的地方

一、网页设计类

-------------------------------

1。网站名称:蓝色理想

网站地址:

http://www.blueidea.com/

简介:[…]

February 7th, 2008

permalink 网页设计资源大全

此文首发于煎蛋 ,原作者为sfufoet (专栏 )。

配色工具
配色最痛苦了。(= =)更多配色工具请参考:为你的网页组合出一个完美的配色方案

Color Schemer Gallery:配色展览馆
COLOURlovers
Website Color Picker
I Like Your Colors:喜欢某个网站的配色?就用这个工具。

免费的 CSS 导航栏菜单
导航栏的重要性不用多说,尤其是一个动感十足有易用的。网上已经有大把的模板,稍稍修改一下就可以用啦。

Listamatic
Exploding Boy
Alvit.de
Dynamic Drive
Our own collection of CSS Menus

制作 DHTML 导航栏软件
Xtreeme DHTML Menu Studio(要 49 刀,#sfufoet:类似的一款软件:Sothink DHTML Menu,也是收费软件。)
找呀找照片
照片拿来做什么?这个我就不懂了。有谁懂?麻烦留言。谢啦。

Stock.Xchng – 大量免费照片
Stock Expert – 要付出一些些钱的照片。
iStockphoto - 同上
Big Stock Photo - 同上

图标
好图标绝对很抢眼。

IconFinder.net – 图标搜索引擎,煎蛋介绍过。
31 Sources of Quality, Free Icons - 图标嘛,煎蛋介绍过很多。请自行搜索。

空白的 WordPress 模板
想做个 WP 主题?看看这些空白模板吧。
CSS [...]

February 7th, 2008

permalink WordPress 主题( Theme )制作经验谈

本文由北极冰仔翻译自 Nick La 原文 WordPress Theme Hack。
转载请务必以超级链接的形式注明本文及原文出处。如您对此存有异议,请勿转载。

WordPress 最初的开发目标只是一个博客平台。但是现在 WordPress 已经日渐强大,你可以使用它来建立任何类型的网站或把它当作一套内容管理系统(CMS)。写这篇文章,我将与大家分享一些关于如何制作更优秀的 WordPress 主题的技巧。我不是程序员或是开发人员,所以我将重点放在前台的开发上。呃,对了,我忘记说了,WordPress 让这类开发变得如此简单,即使是非程序员(像我一样的设计师)也能建立出非常棒的网站来。我的 WordPress 站点包括:N.Design Studio、Best Web Gallery、Web Designer Wall 和一些免费的 WordPress 主题。
WordPress Conditional Tags / WordPress 条件标签
在创建一款动态的 WordPress 主题过程中,条件标签非常有用。它允许你控制哪些内容将会显示、以怎么样的方式显示。下面是一些条件标签的示例:

动态高亮菜单
我在 Best Web Gallery 中使用了动态高亮菜单。假如当前页面是首页(Home)或目录页(Category)或存档页(Archive)或搜索结果页(Search)或单篇日志 页面(Single),class=”current” 属性将会自动加入到第一个列表条目的 li 标签中,它将会高亮显示“Callery”按钮;假如当前页面的缩略名是“about”时,class=”current” 属性将自动加入第二个列表条目的 li 标签中。

<ul id=“nav”>
<li<?php if ( is_home() || is_category() || is_archive() || is_search() || is_single() || is_date() [...]

 Page 1 of 2  1  2 »