|
我喜欢表格。我用table标记开始，制作一个表格。首先给出其宽度为600个象素。然后我用4个<td>，单元格作出第一行，将内容放在最后一个单元格中。前边3个留着以后使用。喔，我的内容占不满单元格，我还要在空隙里放一个GIF图形。 现在，我开始作我的第二行。啊，我没有放置足够的<td>，我还要再加上一些吗？不用。我只要将其中一个<td>变成colspan=2即可。现在，我加入一些图形。为什么这些图形排得不齐？对了，在表格中不能使用空格和回车。 我们来看看表格：它对于数据记录是很不错的。但当它用来为主页进行布局时，就不总是那么伟大了。所以，请记住，一定不要滥用表格。 既然我们不能滥用表格，那你也许要问，我们如何对页面进行布局，以使其看上去井井有条呢？ 你首先想到的应该是样式表。使用CSS，你可以控制颜色、尺寸、边界和页面上绝大多数对象的说明。当然，这些东西都是用简单HTML所不能实现的。这也是W3C的人们要解决的问题，建议在HTML语言中增加样式表。 这项建议不仅仅使你能够将内容放在你想放的任何地方，且不影响文件的结构。目前，Netscape公司和微软公司都已在其浏览器中加入了对CSS的支持。 定位有点象Netscape的layer，但提供了更多的灵活性和控制。layer需要你在每一内容周围放置相应的具体符号，而CSS则几乎适用于所有的内容。因此，CSS定位将成为一种主页设计者和HTML软件设计者的基本工具。 定位草图中用到的新特性为：定位、左、顶部、溢出、剪贴、Z-index、可视性、高度和宽度。 我们将逐一学习这几项特性。首先，我们从定位开始。定位特性下你有两个选择：绝对定位和相对定位（缺省设置为相对定位）。相对定位设置控制正常的HTML页依序流动，即页面内容从顶部开始依次排出，每一个要素的位置由上一个要素的结束位置决定。
决定定位的位置设定要素基于其母体的左上角的位置。所以，如果一个段落不包含在任何要素内，那么它的位置就由页面整体的左上角的位置确定。但是如果它包含 左边和顶部特性指要素起始位置的空间。相对定位了的要素不论以何种方式结束，都会从其相对位置向左上角靠齐（当然也可以设定相反的参数）。 绝对定位了的要素显示你从其母体左上角起设定了的单位的数值，单为指标准的CSS单位：pixel-px,points-pt,inches-in, 及percentage-%。这些单位中我最喜欢用的是percentage。
所以如果一个位于HTML结构最高级的<div>的绝对位置设置为：left：50px,top：50px，则其在页面的显示为：距离页面左边和顶部各50象素（pixels）。 如果它位于一个单位设置为left:100,top:100的段落内，则该<div>的实际位置为距文章左边和顶部各150个象素。 当容器提供的空间不足以使用时，你仍可以通过使用溢出（overflow）功能使容器正常工作。如果将莎士比亚全集放在一个40象素宽，40象素高的<div>内时，会发生什么事情呢？那么，这时就是溢出功能大显神通的时候了。 溢出的参数包括：clip,scroll和none。clip参数用于将过长的内容剪裁下来不予显示。这是所有浏览器的惯常做法（即使其说明书并不这样阐述）。scroll参数在母体容器上放一个滚动条，让读者可以滚动显示内容。这个功能可是太棒了，因为它的执行速度仅是窗框（frame）所用时间的60％。我从来到参数none在任何浏览器内正常工作过，但是现在，它将能够发挥神奇的功能，因为它能是内容超出母体容器的边界限制显示。 Z－index用于确定哪一个要素可以覆盖在另一个要素上显示。比如，如果有两个要素被放在同一个位置，你就需要确定显示哪一个要素，隐藏哪一个要素。具有最高的Z－index值的要素将被放在最高的显示级别，Z－index值最低的要素将被排在显示级别的末尾。这个顺序还相对于母体要素的Z－index值。如果其母体要素的Z－index值排在最末尾，那么即便该要素的Z－index值为1百万，它也不能跨越整体的级别结构优先显示。 Visibility用于控制是否将某要素显示在屏幕上。它的值为visible（显示）和hidden（隐藏）。这里需要记住一点：不要将其同Netscape的分层语法中的show和hide的概念搞混，它们的功用不同。 width和height参数的功能如前所述，但是设置了绝对定位的目标也可以有percentage width和height。所以我非常喜欢percentage这个功能。
现在，你已经了解了用串接样式表定位的基本内容，你可以将页面的内容精确地按照象素标准定位。但是你还得记住，有些人使用的浏览器可能和你现在用的并不一样。另外，设置了绝对定位的目标在尺寸过小的显示器上不能显示滚动条。 有些人仍然坚持应使用分层技术。但是，目前的事实是：CSS定位可以用于两种主要浏览器的现行版本，并且W3C正在考虑采纳CSS作为使用标准，而分层技术只能用于Netscape4.0。如果你想让尽可能多的人看到你制作的网页，并且你只想制作一个文件就解决问题的话，CSS就是你最好的选择。
|
