abc@home
千年狐狸
千年狐狸
  • UID6047
  • 注册日期2005-05-16
  • 最后登录2011-01-01
  • 发帖数1681
  • 经验10枚
  • 威望0点
  • 贡献值0点
  • 好评度1点
15楼#
发布于:2005-07-27 15:15
在复杂结构下很难,甚至不可能,用 div 取代 table 的。例如日常浏览的国内外论坛,就好像没有遇到过不用 table 布局的。



WINXP SP2 MAXTHON (UNICODE) PROXOMITRON
猫头猪
狐狸大王
狐狸大王
  • UID163
  • 注册日期2004-11-25
  • 最后登录2005-12-04
  • 发帖数595
  • 经验10枚
  • 威望0点
  • 贡献值0点
  • 好评度0点
16楼#
发布于:2005-07-27 15:15
supNate:被div布局彻底打败,稍微复杂一点的布局ie和firefox总不能同步的工作,
不得已,还是用了表格和div的混和布局,
现在firefox下总算正常了。
唯一不好解决的还是圆角图片问题,设置margin:-3px,ie下正常,
设置margin:0,firefox下正常
只能取其一了,现在在firefox下看有点突出,总算不是大问题
另外就是xmlhttp和div的innerHtml属性是IE专有,firefox下不能用,郁闷
这么让人舒服的属性要是成为标准多好
回到原帖

xmlhttprequest和innerhtml两个Firefox都支持。这些都是事实标准,mozilla.org也不是不食人间烟火。
猫头猪
狐狸大王
狐狸大王
  • UID163
  • 注册日期2004-11-25
  • 最后登录2005-12-04
  • 发帖数595
  • 经验10枚
  • 威望0点
  • 贡献值0点
  • 好评度0点
17楼#
发布于:2005-07-27 15:15
abc@home:在复杂结构下很难,甚至不可能,用 div 取代 table 的。例如日常浏览的国内外论坛,就好像没有遇到过不用 table 布局的。回到原帖

转变是需要过程的,www.mozilla.org以前还table布局呢。新东西出来到被接受和推广总是需要时间的,现在少不一定代表以后也少。
论坛不算什么复杂结构,就连网易新闻这样的复杂结构都可以转变成div+css布局,何况论坛呢?不过也没必要走极端,论坛列表这样的结构就是一个table,强求变成div,反而不太好。但这并不是布局,只是结构本身如此。
再看看这几年兴起的新鲜玩意,wiki, blog, CMS,采用css布局者也越来越多。css布局没有普通人想像的那么难以掌握,说实话,div+css布局写网页,我用emacs就可以了,要换用table,不拿出个可视化工具来真是搞不定。
supNate
小狐狸
小狐狸
  • UID7615
  • 注册日期2005-07-27
  • 最后登录2005-11-05
  • 发帖数17
  • 经验10枚
  • 威望0点
  • 贡献值0点
  • 好评度0点
18楼#
发布于:2005-07-27 15:15
圆角矩形问题终于解决了
原来ie还留了一手,可以识别注释的内容,汗~
http://www.quirksmode.org/css/condcom.html

我在html中加入
<!--[if IE]>
<style type="text/css">
img.LeftFloat{ float:left;margin-left:-3px;}
img.RightFloat{ float:right;margin-right:-3px;}
</style>
<![endif]-->
这些只有ie能认识,会覆盖link的css文件中的设置,从而两个浏览器显示都正常了。当然这应该放在link之后。

发表评论功能的firefox实现仍在郁闷中。。。
abc@home
千年狐狸
千年狐狸
  • UID6047
  • 注册日期2005-05-16
  • 最后登录2011-01-01
  • 发帖数1681
  • 经验10枚
  • 威望0点
  • 贡献值0点
  • 好评度1点
19楼#
发布于:2005-07-27 15:15
猫头猪
转变是需要过程的,www.mozilla.org以前还table布局呢。新东西出来到被接受和推广总是需要时间的,现在少不一定代表以后也少。
论坛不算什么复杂结构,就连网易新闻这样的复杂结构都可以转变成div+css布局,何况论坛呢?不过也没必要走极端,论坛列表这样的结构就是一个table,强求变成div,反而不太好。但这并不是布局,只是结构本身如此。
再看看这几年兴起的新鲜玩意,wiki, blog, CMS,采用css布局者也越来越多。css布局没有普通人想像的那么难以掌握,说实话,div+css布局写网页,我用emacs就可以了,要换用table,不拿出个可视化工具来真是搞不定。
回到原帖

這就說明了 table 是有實用價值的。說 table 過時,不應使用,這重說法就不正確。

例如矩陣型式列出數據,只需要一個簡單 table,用 notepad 便可以輕易做到。用 div 的話,即使有可视化工具,仍然要花一番功夫排位。將來修改,又是一番功夫。

而且 table 亦可以使用 css,不一定要使用 table 的 attribute。所以 table 或 div 純粹看頁面結構及實際需要,不能一概而論。



WINXP SP2 MAXTHON (UNICODE) PROXOMITRON
猫头猪
狐狸大王
狐狸大王
  • UID163
  • 注册日期2004-11-25
  • 最后登录2005-12-04
  • 发帖数595
  • 经验10枚
  • 威望0点
  • 贡献值0点
  • 好评度0点
20楼#
发布于:2005-07-27 15:15

這就說明了 table 是有實用價值的。說 table 過時,不應使用,這重說法就不正確。

例如矩陣型式列出數據,只需要一個簡單 table,用 notepad 便可以輕易做到。用 div 的話,即使有可视化工具,仍然要花一番功夫排位。將來修改,又是一番功夫。

而且 table 亦可以使用 css,不一定要使用 table 的 attribute。所以 table 或 div 純粹看頁面結構及實際需要,不能一概而論。

没有人说过table不能用,table和其他html tag一样,该用的时候为什么不能用? 我所不赞成的是使用table布局,这不是table推荐使用的地方.
有人说table要用,因为存在表格结构,有人说table不能用,因为table布局破坏结构,实际一个讲结构,一个讲排版,问题域已经不同
猫头猪
狐狸大王
狐狸大王
  • UID163
  • 注册日期2004-11-25
  • 最后登录2005-12-04
  • 发帖数595
  • 经验10枚
  • 威望0点
  • 贡献值0点
  • 好评度0点
21楼#
发布于:2005-07-27 15:15
今天看到的一个关于no table css layout的slides,
http://www.stopdesign.com/present/2004/ ... le/tables/
里面很好的讲了什么时候该用table,什么时候则不合适.
supNate
小狐狸
小狐狸
  • UID7615
  • 注册日期2005-07-27
  • 最后登录2005-11-05
  • 发帖数17
  • 经验10枚
  • 威望0点
  • 贡献值0点
  • 好评度0点
22楼#
发布于:2005-07-27 15:15
其实说到底有点不明白网页为什么需要结构性了,要想真正的结构化用xml好了,再用xsl来显示。
两个并列的div要保持同样的高度真是个问题,想要在不同的浏览器上正确的浮动也很困难,就连hotmail也常常会出现不正常的浮动现象。
其实用css控制table来排版也是不错的,在某些情况下的确方便了很多。的确是破坏了一些结构性,table的作用只是排版。为了所谓的结构性去写复杂的css好像有点本末倒置了。web本来就是设计用来表现的。
可以看到,很多很好支持标准的网站都是方方框框的,感受的到设计者为了符合标准放弃了使用复杂界面的机会。这也是使用标准的一些悲哀。华丽的符合标准的页面固然存在,可惜很少。
现在只有一个体会,有了css,table已经不再是原来的table。
用它来布局,事半功倍。
猫头猪
狐狸大王
狐狸大王
  • UID163
  • 注册日期2004-11-25
  • 最后登录2005-12-04
  • 发帖数595
  • 经验10枚
  • 威望0点
  • 贡献值0点
  • 好评度0点
23楼#
发布于:2005-07-27 15:15
当然可以用xml, XHTML就是xml格式的html.
如果是两个并列的结构,你应该考虑的是用list而不是div.把所有的table全部换成div,无非是从一个没结构到另一个没结构,自讨苦吃.
在不同浏览器上正确float不是什么难事,关键是你有没有正确理解float.
至于使用css layout和复杂设计的关系,清者自清,浊者自浊,没什么好说的.
fiag
管理员
管理员
  • UID1188
  • 注册日期2004-12-21
  • 最后登录2024-04-22
  • 发帖数4681
  • 经验686枚
  • 威望0点
  • 贡献值402点
  • 好评度51点
24楼#
发布于:2005-07-27 15:15
结构性的网页可以更好的支持多种浏览器。
例如在lynx上也能正常浏览mozilla.org, 各种链接依然井井有条。而table布局就不是那么明朗了。


为了符合标准放弃了使用复杂界面的机会,只个人体会因为写出一个界面华丽的CSS不容易,而且已有的例子少,可视化工具少,而table布局就更为简单,而且工具也多,比如PS,FW切片。这当然就能更好的区分高手和低手了
supNate
小狐狸
小狐狸
  • UID7615
  • 注册日期2005-07-27
  • 最后登录2005-11-05
  • 发帖数17
  • 经验10枚
  • 威望0点
  • 贡献值0点
  • 好评度0点
25楼#
发布于:2005-07-27 15:15
fiag:结构性的网页可以更好的支持多种浏览器。
例如在lynx上也能正常浏览mozilla.org, 各种链接依然井井有条。而table布局就不是那么明朗了。


为了符合标准放弃了使用复杂界面的机会,只个人体会因为写出一个界面华丽的CSS不容易,而且已有的例子少,可视化工具少,而table布局就更为简单,而且工具也多,比如PS,FW切片。这当然就能更好的区分高手和低手了
回到原帖
其实讨论到这了,采用table还是用div和是否有可视化的编辑工具已经完全无关了,用table布局并不等于就用工具生成代码,更不会用到ps,fw切片来生成臃肿的html。
另外,不知道是不是有人觉得写华丽界面用css要比table方便的多。暂且不考虑结构性问题。
abc@home
千年狐狸
千年狐狸
  • UID6047
  • 注册日期2005-05-16
  • 最后登录2011-01-01
  • 发帖数1681
  • 经验10枚
  • 威望0点
  • 贡献值0点
  • 好评度1点
26楼#
发布于:2005-07-27 15:15

没有人说过table不能用,table和其他html tag一样,该用的时候为什么不能用?...

呵呵,对啊!

但这里或 mozillazine 都有些人因为看到 w3c 建议使用 div + css,就盲目地批评 table 为过时落后呢。;)



WINXP SP2 MAXTHON (UNICODE) PROXOMITRON
abc@home
千年狐狸
千年狐狸
  • UID6047
  • 注册日期2005-05-16
  • 最后登录2011-01-01
  • 发帖数1681
  • 经验10枚
  • 威望0点
  • 贡献值0点
  • 好评度1点
27楼#
发布于:2005-07-27 15:15
...
另外,不知道是不是有人觉得写华丽界面用css要比table方便的多。暂且不考虑结构性问题。

table cell 的大小及位置受到一定程度限制,及不上 div 灵活。



WINXP SP2 MAXTHON (UNICODE) PROXOMITRON
fiag
管理员
管理员
  • UID1188
  • 注册日期2004-12-21
  • 最后登录2024-04-22
  • 发帖数4681
  • 经验686枚
  • 威望0点
  • 贡献值402点
  • 好评度51点
28楼#
发布于:2005-07-27 15:15
……
另外,不知道是不是有人觉得写华丽界面用css要比table方便的多。暂且不考虑结构性问题。

举个例子,就谈mozilla网页头部的圆角方框栏
如果用table布局,很容易想到3X3的表格,border=0 cellspace=0 cellpadding=0,四个角和边框用圆角的图片撑住,其他的用背景图片。

mozilla logo 和 右半部 也用表格分开,嵌套一个表格。

站内搜索和下载区,讨论区导航栏也用表格上下分好,所以这里要再嵌套一个表格。

下载区讨论区也要用表格控制,这里还需要再嵌套一个表格,

然后导航栏各项也有圆角,再各自嵌套一个表格。

到次table布局基本结束。但是还没有实现,搜索输入框变色和导航栏背景变换的特效,如果不用CSS,只有用更麻烦的Javascript来完成。

----

现在解析这个圆角方框标题栏的Div+CSS解构。
整个标题栏只在div#topheader中,div有三个主要元素,<h1>, 列表<ul>和提交表单<form>。
所有效果是通过CSS控制,layout就不谈了,只谈华丽效果
div只设置了背景图片。

在<h1>中设置了一个背景,也就是mozilla logo,然后将<h1>中包含的文字隐藏了。并且通过 #topheader h1 和 #topheader h1 a 造成了左边上下两个圆角的效果。

列表<ul>的各项,每项都有一个背景图片,背景的变换是通过偏移背景图片实现的
而且实现了右下的圆角

form的文本输入栏和按钮的样式就不用说了,实现了右上的圆角。

---

综上所诉,CSS的华丽效果实现要比table layout难得多,光实现思路上都十分复杂,

再举例,可以自行分析下gmail的圆角实现。
fiag
管理员
管理员
  • UID1188
  • 注册日期2004-12-21
  • 最后登录2024-04-22
  • 发帖数4681
  • 经验686枚
  • 威望0点
  • 贡献值402点
  • 好评度51点
29楼#
发布于:2005-07-27 15:15
……
但这里或 mozillazine 都有些人因为看到 w3c 建议使用 div + css,就盲目地批评 table 为过时落后呢。;)


批评的是过时的 table layout。看到div + css难道还会想到网页布局以外的事情?

table的主要用途是列出表格式数据,也就是每行每列都有相关或相同的性质。

用table+透明gif的布局做法确实有些滥用迹象,而且是CSS技术不成熟的时代产物。

不必再多做解释,时间和事实会证明一切。
游客

返回顶部