从权威网站上“偷”窃

权威网站的设计都是有其可学之处的，如果有时间不防看看它们的源代码（HTML代码）。
至少可以学到这些吧：
1。页面布局风格；
2。Javascript代码，CSS原码；
2。CSS,Javascript脚本联合操纵Dom；
以微软的官方网站和MSN中国为例：
在微软的官方网站上已看不到table的影子，页面布局全部采用CSS+DIV控制。
最多用到的HTML元素恐怕就是DIV和UL了。
利用CSS可以精确的将DIV布置在页面的任何地方。
通过脚本控制轻易实现动感DIV效果。涉及到数据读取时可以采用富客户端方式（数据一次性加载到客户端），
也可以采用当下流行的AJAX方式。
下面是MSN中国上的一个效果：

整理后的HTML


标准的CSS＋DIV布局，在body中只有以下一些东西：
1。HTML元素（DIV,UL等）;
2。HTML元素对应的CSS（可以是Class也可以是Id对应）;
3。HTML元素对应的JavaScript事件(单击触发，鼠标滑过触发等);
4。HTML元素中的数据;
涉及布局，显示等全部在CSS中控制，例如：
◆字体效果:<font>，<strong>等
◆布局效果:<br>,<center>,<p>等
◆样式效果:<style>等
是不会出现在body中的
下面是微软中国的一个效果：

整理后的HTML


其中有很多JavaScript函数我们大可直接拿来。(如library)
以上两个例子的原码下载：微软&MSN

-----------------------20090320补充------------------------------

效果：

代码：

Code

posted @ 2007-08-16 16:12  青羽  阅读(960)  评论(2)  编辑  收藏  举报