`
fixopen
  • 浏览: 83875 次
文章分类
社区版块
存档分类
最新评论
阅读更多
今天看了hax的blog,不知道哪个项里面提到了CSS面对表格的col的时候的尴尬。后来深入思考了一下,发现这其实是一个本质性的困难。而且问题并不是出现在CSS上,而是出现在XML上。

由于XML要求任何一个元素(除了根元素)都必须有且只有一个父元素,这就导致XML的table模型有些不自然,因为,一个cell显然是一个row的子,但是我们也可以说它同时也是col的子,可是由于XML(DOM)强制的树状模型,导致这个没有办法实现。这可以说是层次型数据和关系型数据的一个典型分野。在关系型数据库中,col可以认为是描述row数据的数据,也就是元数据,或者叫做关系。想要真正的解决这个问题,也就是说,想要XML能够自然的描述table,显然需要打破只有一个父这个局限性,对于table来说,需要两个父,因为table是二维的。但是,一放纵未免再放纵,能够有两个父显然就要想到为什么不能有多个父……,这显然超出了XML最初的预想,也超出了层次型数据模型的能力,什么时候能够把层次型模型和关系型模型无缝的融合起来(还有网状数据模型,跟现在的Web本身一样:),什么时候table在XML描述就没有问题了。

上面提出的这个方案可以说有点太迂远,不适合作为真正的解决方案推荐给网页设计者们。我们考虑一个可以实现的。

本质上CSS只是给出一个或者一些元素的外观,所以,它本身不受层次和关系模型的困扰。而就算CSS中的C是层次型生效的,也不影响我们对一个元素规定多个样式,它们会叠加起来的。

就像很难用一个类型体系(分类体系)把知识组织起来一样,从CSS的表现角度来说,Web Page上的元素也很难分类一个特定的类,它们总是有可能隶属于不同的类,比如:它们可以归为高亮(强调)类,也可以同时归为楷体(内容)类。幸运的是,CSS从来没有限制自己的叠加,虽然它大多数情况下思考的角度是子继父样,然后叠加自己特有的样子,但是毕竟它提供了一个叠加的机制,这样我们就可以随意的叠加了。

现在的问题是,如果规定了col的样式,如何应用到隶属于col的cell上?我们看过委员会的解释,知道不能采用子继父样这个通用的CSS Render机制,是不是就没有办法了呢?

不是。仔细考虑col的本质,col规定了table的结构信息,也就是说,它其实规定了row中数据的元数据。规定col的样式的意义是什么?

这不禁让我们想起了一系列相关的元素,规定head的样式的意义是什么?规定base font的意义是什么?规定title的意义是什么?这些元素归根结底都是元数据。对于它们的规定要影响到它们影响到的数据才行。所以,规定base font的样式应该影响到font的样式,而规定col的样式应该影响到row(进而影响到cell)的样式。

焦点集中到“查找一个元素可以应用的样式”这一个步骤上,我们也只需要改变这一个步骤,能够区分出XML(XHTML)中的元数据和数据,并且能够理解元数据所描述或者关联的数据,就可以把该元数据的样式应用到其所描述的数据上。

这个方案应该是比较完善的,并且是可以扩展的。我想,除了XML本身的层次结果以外,元数据和数据这个层次结构(显然可以层层叠加,也是一个潜在的无限层次的树)也是一个重要的考虑维度,并且潜在的对于元素的外观的影响应该比XML本身的层次结构影响更大。

不知道W3C会不会增加这个看起来比较复杂的方案?

它们最初的方案似乎是改进table模型,但是,其实不仅仅是table模型本身,所有的数据都潜在的有这样一个问题。尤其是那些自说明文档,它们常常是自包含的,也就是说,是数据和元数据存放在一起的。所以,必须有一套机制用来指定这个层次关系。

之所以有这样的多个维度的层次关系,原因还是上面说的【很难用一个类型体系(分类体系)把知识组织起来】,不仅仅对于表现有影响,实际上,对数据的影响是通过对表现的影响展现出来了而已。
分享到:
评论

相关推荐

    div+css百分比表格+DIV+CSS+JS静态分页程序+DIV+CSS像素表格

    DIV+CSS表格(用DIV+CSS做的表格像素表格) 内容不多但是绝对实用,其实在做数据显示时还是推荐用表格,因为不是所有的地方数据显示有用DIV+CSS,在数据显示时表格还是有很大的优势。不过这个还是要看个人爱好!

    js css精美表格

    "js css精美表格"的主题涉及到了JavaScript和CSS技术在创建美观、交互性强的表格方面的应用。在这个主题下,我们可以深入探讨以下几个关键知识点: 1. CSS(层叠样式表):CSS是用于控制网页元素样式的重要工具。在...

    CSS表格样式1

    这篇博文“CSS表格样式1”可能详细讲解了如何利用CSS来定制HTML表格的外观和布局。由于描述中没有提供具体信息,我将根据常见的CSS表格样式实践进行详细讲解。 首先,我们来了解一下HTML表格的基本结构,由`<table>...

    8款好看的css表格.rar

    综上所述,“8款好看的css表格.rar”资源中的示例将展示如何通过CSS技术实现各种独特的表格设计,帮助开发者提升网页界面的美观度和用户体验。通过学习和借鉴这些示例,你可以掌握更多关于CSS表格设计的技巧,为你的...

    8款非常好看的css表格

    每款CSS表格都有其独特之处,开发者可以根据项目需求和审美偏好选择合适的设计。在实际应用中,理解并熟练运用CSS来美化和优化表格布局是提升网页质量的关键。同时,需要注意的是,良好的表格设计不仅要考虑视觉效果...

    css+div控制表格 标签代码

    在网页设计中,CSS(Cascading Style Sheets)与HTML中的`div`元素结合使用,可以实现更加精细和灵活的...而提供的压缩包文件“css的表格控制”很可能包含了示例代码和教程,帮助开发者更深入地学习和实践这些技术。

    21个新奇漂亮的AjaxCSS表格设计

    标题和描述均提到了“21个新奇漂亮的AjaxCSS表格设计”,这表明文章旨在介绍一系列结合了Ajax和CSS技术的创新表格设计方案。Ajax(Asynchronous JavaScript and XML)是一种用于创建快速动态网页的技术,它允许网页...

    一些漂亮的CSS表格样式

    一些非常漂亮实用的CSS表格样式,使用方便.页面简洁!

    漂亮的表格css+html

    通过学习和实践这些示例,开发者可以掌握创建高效、优雅的HTML表格和CSS样式的技巧,提升网页设计的水平。 记住,优秀的表格设计不仅关注外观,也要考虑用户体验。清晰的布局、易读的字体、合理的色彩搭配以及对...

    精美的css控制表格样式

    表格在网页中常用于展示数据,如报告、统计数据或产品目录,而通过恰当的CSS应用,我们可以让这些表格更加吸引人,提高用户体验。 1. **基础表格样式**:CSS中的`table`, `th`, `td`, `tr`等选择器是控制表格样式的...

    css表格样式打包下载

    以下是一些关于CSS表格样式的知识点: 1. **基本样式设置**:首先,可以使用`border-collapse`属性来合并单元格边框,例如`border-collapse: collapse;`,以创建简洁的表格外观。`border-spacing`属性则可以控制...

    html纯css实现表格样式

    CSS 则通过选择器和属性来控制表格的样式。以下是一些关键知识点: 1. **基础表格样式**:首先,可以使用 `border-collapse` 属性设置表格边框合并,例如 `border-collapse: collapse;`。这将使相邻单元格的边框...

    漂亮的CSS立体表格效果.rar

    在本主题“漂亮的CSS立体表格效果”中,我们将探讨如何利用CSS来实现引人注目的3D立体感的表格设计,这在网页交互设计中可以提升用户体验,使数据展示更加生动有趣。 首先,理解CSS的基本结构至关重要。CSS由选择器...

    css table 表格标签

    在本教程中,我们将深入探讨如何使用CSS来美化和增强HTML表格的表现力。 首先,让我们了解CSS如何与HTML表格配合。CSS可以应用于表格的各个部分,如表格本身、表格行、表格列、单元格等,以实现定制化的样式。例如...

    纯CSS3漂亮表格(圆角、渐变、多背景色).rar

    总之,“纯CSS3漂亮表格(圆角、渐变、多背景色)”是一个很好的示例,它展示了如何利用CSS3的新特性提升网页设计的美感和交互性。通过学习和应用这些技巧,开发者可以创建出更具吸引力和现代感的网页应用。在压缩包...

    CSS在表格边框上的美学应用

    在网页设计中,CSS(Cascading Style Sheets)起着至关重要的作用,特别是在美化和布局方面。当涉及到表格时,CSS的应用能够使表格的边框展现出丰富的美学效果,提升整体的视觉体验。以下是对CSS在表格边框美学应用...

    div+css制作表格

    ### 使用div+CSS实现类似Excel的表格功能 在网页设计中,使用`div+CSS`来构建表格是一种灵活且响应式的设计方式。这种方式不仅能够帮助我们创建出与传统`<table>`标签相似的布局效果,还能更好地控制表格的样式、...

    利用CSS仿Excel表格的效果

    在网页设计中,为了模拟Excel表格的样式和功能,我们可以借助CSS(层叠样式表)来实现。CSS是一种用于描述HTML或XML(包括如SVG、MathML等各种XML方言)文档样式的语言,它能让我们精确控制网页元素的布局和外观。...

Global site tag (gtag.js) - Google Analytics