打印

[讨论] 发一个三栏等高布局的Demo

greengnn [楼主]

酒酣几度
荣誉管理团队

帖子: 1058
体力: 1611
威望: 114
当前: 广东深圳
离线: 9 天

1^# 大中小发表于 2008-3-4 13:28 只看该作者

一个三栏等高布局的Demo。修改国外的一个demo，兼容到了IE5.5+ 和标准的浏览器Opera Firefox Safari

<?xml version="1.0" encoding="gb2312"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta http-equiv="Content-Language" content="zh-CN" />
<meta content="all" name="robots" />
<title>3 column lauput</title>
<style type="text/css" media="screen">

</style>
</head>
<body>
<div id="header">header(test in IE5.5+ opera9.0 Firefox 2.0)</div>
<div id="container">
	<div id="center">
		<h2>Abstract</h2>
		<p>The web is constantly evolving. New and innovative websites are being created     every day, pushing the boundaries of HTML in every direction. HTML 4 has     been around for nearly a decade now, and publishers seeking new techniques to     provide enhanced functionality are being held back by the constraints of     the language and browsers.</p>
		<p>To give authors more flexibility and interoperability, and enable  more interactive and exciting websites and applications, HTML 5  introduces and enhances a wide range of features including form  controls, APIs, multimedia, structure, and semantics.</p>
		<p>Work on HTML 5, which commenced in 2004, is currently being carried out in     a joint effort between the <a href="http://www.w3.org/html/"><abbr title="W3C HTML Working Group">W3C HTML     WG</abbr></a> and     the <a href="http://www.whatwg.org/"><abbr title="Web Hypertext Application Technology Working Group">WHATWG</abbr></a>.     Many key players are participating in the W3C effort including representatives     from the four major browser vendors: Apple, Mozilla, Opera, and Microsoft;     and a range of other organisations and individuals with many diverse interests     and expertise.</p>
		<p>Note that <a href="http://www.w3.org/html/wg/html5/">the     specification</a> is still a <em>work in progress</em> and quite a long     way from completion. As such, it is possible that any feature discussed in     this article may change in the future. This article is intended to provide     a brief introduction to some of the major features as they are in the current     draft.</p>
	</div>
	<div id="left">
		<h2>Abstract</h2>
		<p>The web is constantly evolving. New and innovative websites are being created     every day, pushing the boundaries of HTML in every direction. HTML 4 has     been around for nearly a decade now, and publishers seeking new techniques to     provide enhanced functionality are being held back by the constraints of     the language and browsers.</p>
		<p>To give authors more flexibility and interoperability, and enable  more interactive and exciting websites and applications, HTML 5  introduces and enhances a wide range of features including form  controls, APIs, multimedia, structure, and semantics.</p>
		<p>Work on HTML 5, which commenced in 2004, is currently being carried out in     a joint effort between the <a href="http://www.w3.org/html/"><abbr title="W3C HTML Working Group">W3C HTML     WG</abbr></a> and     the <a href="http://www.whatwg.org/"><abbr title="Web Hypertext Application Technology Working Group">WHATWG</abbr></a>.     Many key players are participating in the W3C effort including representatives     from the four major browser vendors: Apple, Mozilla, Opera, and Microsoft;     and a range of other organisations and individuals with many diverse interests     and expertise.</p>
		<p>Note that <a href="http://www.w3.org/html/wg/html5/">the     specification</a> is still a <em>work in progress</em> and quite a long     way from completion. As such, it is possible that any feature discussed in     this article may change in the future. This article is intended to provide     a brief introduction to some of the major features as they are in the current     draft.</p>
	</div>
	<div id="right">
		<h2>Abstract</h2>
		<p>The web is constantly evolving. New and innovative websites are being created     every day, pushing the boundaries of HTML in every direction. HTML 4 has     been around for nearly a decade now, and publishers seeking new techniques to     provide enhanced functionality are being held back by the constraints of     the language and browsers.</p>
		<p>To give authors more flexibility and interoperability, and enable  more interactive and exciting websites and applications, HTML 5  introduces and enhances a wide range of features including form  controls, APIs, multimedia, structure, and semantics.</p>
		<p>Work on HTML 5, which commenced in 2004, is currently being carried out in     a joint effort between the <a href="http://www.w3.org/html/"><abbr title="W3C HTML Working Group">W3C HTML     WG</abbr></a> and     the <a href="http://www.whatwg.org/"><abbr title="Web Hypertext Application Technology Working Group">WHATWG</abbr></a>.     Many key players are participating in the W3C effort including representatives     from the four major browser vendors: Apple, Mozilla, Opera, and Microsoft;     and a range of other organisations and individuals with many diverse interests     and expertise.</p>
		<p>Note that <a href="http://www.w3.org/html/wg/html5/">the     specification</a> is still a <em>work in progress</em> and quite a long     way from completion. As such, it is possible that any feature discussed in     this article may change in the future. This article is intended to provide     a brief introduction to some of the major features as they are in the current     draft.</p>
	</div>
</div>
<div id="footer">footer</div>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript"></script>
<script type="text/javascript">
/*<![CDATA[*/
	_uacct = "UA-496414-1";
/*]]>*/
</script>
</body>
</html>

提示：您可以先修改部分代码再运行

不过hack太多，不是很喜欢这样做。

greengnn's space/web design
Design your life with Web Standards Web商业模式讨论群：38032840

TOP

firhome

初级会员

帖子: 91
体力: 98
威望: 0
当前: 陕西西安
离线: 1 天

发短消息

2^# 大中小发表于 2008-3-4 13:45 只看该作者

收藏了！

TOP

nanzhilian

中级会员

帖子: 123
体力: 251
威望: 0
离线: 2 天

发短消息

3^# 大中小发表于 2008-3-4 13:47 只看该作者

....看不下去。。

我才12岁：www.12sui.cn

TOP

czbad

蓝色飞扬
中级会员

帖子: 193
体力: 199
威望: 13
当前: 广东广州
离线: 4 天

4^# 大中小发表于 2008-3-5 12:21 只看该作者

复制内容到剪贴板

代码:

<script src="http://www.google-analytics.com/urchin.js" type="text/javascript"></script>

<script type="text/javascript">

/*<![CDATA[*/

    _uacct = "UA-496414-1";

/*]]>*/

</script>

请问一下这个js有什么用呢?我看到很多网站在最后也加了这句script..

http://www.gzlinyi.cn

TOP

Kamov

中级会员

帖子: 118
体力: 241
威望: 0
当前: 湖北武汉
离线: 2 天

发短消息

5^# 大中小发表于 2008-3-5 12:25 只看该作者

谷歌的访问统计...

TOP

abyss253

初级会员

帖子: 37
体力: 70
威望: 0
当前: 辽宁大连
离线: 74 天

发短消息

6^# 大中小发表于 2008-3-5 13:09 只看该作者

有点赚ip点数的嫌疑。。。。

hate MF

TOP

游离的灵

新手上路

帖子: 7
体力: 25
威望: 0
离线: 69 天

发短消息

7^# 大中小发表于 2008-3-10 09:54 只看该作者

那个google统计还没有那么笨吧：）

TOP

MarVell

高级会员

帖子: 654
体力: 597
威望: 0
当前: 河南洛阳

发短消息

8^# 大中小发表于 2008-3-10 23:47 只看该作者

感觉其中一个方法和我从前写的这个有点像...

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="utf-8" />
<title>演示</title>
<meta name="author" content="MarVel" />
<style type="text/css">

</style>
</head>
<body>
<div id="box">
    <div id="box_left"><br /><br /><br /><br /></div>
    <div id="box_right"><br />1<br /></div>
	<div id="lb_line"></div>
	<div id="rb_line"></div>
    <div style="clear:both;"></div>
</div>
</body>
</html>

提示：您可以先修改部分代码再运行

不在放荡中变坏,就在沉默中变态...

TOP

zoloadang

古斯比德
银牌会员

帖子: 486
体力: 1097
威望: 2
当前: 浙江杭州
离线: 3 天

9^# 大中小发表于 2008-3-11 10:31 只看该作者

楼主可以把标题改成Hack范例展示了！

TOP

zengjianhua

高级会员

帖子: 383
体力: 607
威望: 5
当前: 广东深圳
离线: 1 天

10^# 大中小发表于 2008-3-11 11:52 只看该作者

都是hack方法了，看着都头晕，现在发现做一个页面要懂得的东西是越来阅读了，越来越复杂了，累人呀！

曾加设计

TOP

wwufengg

下雨收衣服
中级会员

帖子: 652
体力: 464
威望: 0
当前: 广东深圳
离线: 1 天

11^# 大中小发表于 2008-3-11 11:57 只看该作者

引用:

原帖由 zengjianhua 于 2008-3-11 11:52 发表
都是hack方法了，看着都头晕，现在发现做一个页面要懂得的东西是越来阅读了，越来越复杂了，累人呀！

严重同意，都是兼容问题惹的祸。

指动琴弦

TOP

chez

初级会员

帖子: 45
体力: 96
威望: 0
当前: 浙江杭州
离线: 53 天

发短消息

12^# 大中小发表于 2008-3-11 14:21 只看该作者

那个为opera写的hack 我昏了..

TOP

7oine

初级会员

帖子: 44
体力: 80
威望: 0
当前: 云南昆明
离线: 2 天

13^# 大中小发表于 2008-3-11 15:22 只看该作者

顶上加个<a href="#id5">为数不多的中文,点点看.</a>.
底下加个<h6 id="id5">这里也是中文.有好戏看了吧.</h6>

测试FF IE7 有问题..IE6和Opera貌似还可以骗骗..

我是柒米。

TOP