(2008-08-17 16:50)
这次是我业余威克生涯的第三次中标,而且是一次中了两标,不过都是属于同的个网站的项目,分别是”
My Language Town网站风格美工设计“和“
mylanguagetown.com的Logo设计”,这两个项目一开始本来是放在同一个竞标任务中进行的,不过后来发布者由于对大家的LOGO设计不太满意,有单独出了个竞标项目~呵呵
在这里放上最终的中标作品
LOGO:
页面效果图最终稿:
当多个浮动的元素彼此跟随,中间加注释的时候,最后一个浮动元素内的文本偶尔会复制到最下面去。学名Duplicate
Characters Bug
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN'
'//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>
<html xmlns='//www.w3.org/1999/xhtml'>
<head>
<meta http-equiv='Content-Type' content='text/html;
charset=gb2312' />
<title>多了一只猪</title>
</head>
<body>
<div style='width:400px'>
<div style='float:left'></div>
<!-- -->
<div
style='float:right;width:400px'>↓这就是多出来的那只猪</div>
</div>
</body>
</html>
可以通过以下的办法来解决:
1、不放置注释。最简单、最快捷的解决方法
2、注释不
总结出通过W3C XHTML1.0标准需要注意的九个问题:
一、在 <div class=tzh>I am TZH!</div> 这段语句中有什么错误?
标点符号问题。这其实也是大家最容易忽视的问题,其实就是小小的两个引号,就造成了这个错误。虽然很多浏览器在不加引号的情况下仍然能正确识别渲染。但
是这样想要通过严格的W3C XHTML国际标准是不可能的,请大家记住等号后面一定要接引号。正确写法:<div class=
'tzh'>I am TZH!</div>
二、在 <SPAN class='tzh'>TZH is me!</SPAN> 这段语句中有什么错误?
大小写注意。这和第一个问题一样,都是特别容易忽视的细节问题。在W3C标准中是绝对不允许大写的,其中我仍记得我在检测一段javascript代码
的时候,由于为了让自己一目了然写出的onLoad也被判断成了错误,原因就是L不能大写。正确写法:<span class='tzh'>
TZH is me!</span>
三、在 <p>I am TZH!</p><br><p>TZH is&
本例的javascript代码用于获得在CSS文件中声明的特定样式中的某属性值。如:
<link id='system_style' type='text/css' href='global.css' rel='stylesheet'/>
<div id='myArticle'>
...
</div>
在global.css中声明了
#myArticle{
width:400px;
height:300px;
}
这样的情况下,直接通过JS进行getElementById(’myArticle’).style.width是无法获取400px的值的,因为这个数值定义在CSS里,所以,必须要用其他方法,我写了以下函数:
function getStyle
CSS兼容问题一直困扰着CSSer,面对各浏览器,往往感觉束手无策,愁眉不展。CSS Hack是在标准CSS没办法兼容各浏览器显示效果时才会用上的补救方法,在各浏览器厂商解析CSS没有达成一致前,我们只能用这样的方法来完成这样的任务。
我进行前端开发的时候,测试用的浏览器大致有: IE7、IE6、Opera9(文章撰写时版本为9.25 8825),Safari3(文章撰写时版本为3.0.4 523.15),Firefox2(文章撰写时版本为2.0.0.11)等。
在正常的 selector { property:value; } 的基础上常会根据具体情况为相同元素使用Hack以达到浏览器间统一,更详细的CSS兼容知识,欢迎关注52CSS.com的相关文章。
IE系列
selector { +property:value; } 在属性名前加上加号'+',这个Hack只有IE系列可以识别.
selector { *property:value; } 在属性名前加上星号'*',这个Hack只有IE系列可以识别.
selector { _property:value; } 在属性名前加上下划线'_',这个Hac
CSS隔行换色的问题,其实很简单,您可以根据您的需要,采用下面的任何一种方法,当然,要适合你的编码与需求情况:
一、background背景图片
如果行高固定的话,推荐使用背景图,也推荐将行高固定!兼容一切浏览器。
二、CSS Expression
文字:color:expression_r(this.sourceIndex%2
? '#ff0000':'#000000');
背景:background-color:expression_r(this.sourceIndex%2 ? '#ff0000':'#000000');
注意:本方法浏览器兼容度不够,不支持FF3。
三、class分别定义
<ul>
<li class='bgcolor'>...
<li>...
<li class='bgcolor'>...
<li>...
</ul>
实实在在的写法。
四、通过JS 看实例
(2008-08-11 17:37)
当我们提到漂亮的网页设计的时候,一个很容易被忽视的网站元素就是分类列表。所以我想通过这篇文章来总结一些我看到过的很棒的网站分类列表设计,分享给大家。也希望大家通过这篇文章重视分类列表的设计。
希望大家在欣赏这些原创的设计的同时,仔细观察它们的细节,理解它们的创意。然后一起来讨论如何才能将自己的分类列表设计得如此漂亮
分类页
一些网站有一个专门的分类页面,但遗憾的是,我看过的大多实例使用的都是很乏味的日志列表。所以现在我们来讨论一下那些引人注目的分类页面。
我们将通过后面的几个实例了解网页设计师展示分类页面的不同方法,而且有少数网站我们之前看到过(三重推荐!)
(2008-08-11 17:20)
当我们提到漂亮的网页设计的时候,一个很容易被忽视的网站元素就是分类列表。所以我想通过这篇文章来总结一些我看到过的很棒的网站分类列表设计,分享给大家。也希望大家通过这篇文章重视分类列表的设计。
希望大家在欣赏这些原创的设计的同时,仔细观察它们的细节,理解它们的创意。然后一起来讨论如何才能将自己的分类列表设计得如此漂亮
页脚
相比使用侧边栏,网页设计中一个普遍流行的方式是在页脚位置放置补充信息(比如导航、分类列表、缩略图等)。如果使用页脚而取代侧边栏,那么页脚将能为页面的主要内容提供更多的空间;而且它还能为页面的底部创建漂亮的锚。在这里我们能看到在网站中被定义为“楼底”的页脚。我们还能了解到一些放在底部内容区的“伪页脚”。
(2008-08-11 17:13)
当我们提到漂亮的网页设计的时候,一个很容易被忽视的网站元素就是分类列表。所以我想通过这篇文章来总结一些我看到过的很棒的网站分类列表设计,分享给大家。也希望大家通过这篇文章重视分类列表的设计。
希望大家在欣赏这些原创的设计的同时,仔细观察它们的细节,理解它们的创意。然后一起来讨论如何才能将自己的分类列表设计得如此漂亮
交互式
首先,来看看Alex
Buga
(2008-08-11 17:04)
当我们提到漂亮的网页设计的时候,一个很容易被忽视的网站元素就是分类列表。所以我想通过这篇文章来总结一些我看到过的很棒的网站分类列表设计,分享给大家。也希望大家通过这篇文章重视分类列表的设计。
希望大家在欣赏这些原创的设计的同时,仔细观察它们的细节,理解它们的创意。然后一起来讨论如何才能将自己的分类列表设计得如此漂亮。
标签云
先来个比较与众不同的 coda.coza